Tengo una consulta sobre los tamaños de los gráficos. Estoy tratando de codificar la detección de colisiones, mi código es el siguiente:

 const collided = (objectBounds, bounds) => { return ( objectBounds.x + objectBounds.width > bounds.x && bounds.x + bounds.width > objectBounds.x && objectBounds.y + objectBounds.height > bounds.y && bounds.y + bounds.height > objectBounds.y ); }; const restrictPosToObjectBounds = (objectBounds, bounds, oldBounds) => { if (collided(objectBounds, bounds)) return oldPos; else return { x: bounds.x, y: bounds.y }; };

Y luego lo llamaré así:

 const objectPosition = object.getLocalBounds() const oldPosition = object.getLocalBounds() restrictPosToObjectBounds ( objectPosition, { ...getNewPos(oldPosition), width:oldPosition.width, height:oldPosition.height, }, oldPosition )

Lo cual funciona un poco, pero habría una gran brecha alrededor del objeto con el que estoy chocando, dejándome incapaz de chocar correctamente con él.

Si cambio mi función de colisión a esto (dividiendo el ancho y las alturas por la mitad)

 const collided = (objectBounds, bounds) => { return ( objectBounds.x + objectBounds.width / 2 > bounds.x && bounds.x + bounds.width / 2 > objectBounds.x && objectBounds.y + objectBounds.height / 2 > bounds.y && bounds.y + bounds.height / 2 > objectBounds.y ); };

Entonces funciona correctamente, ¿alguna idea de por qué? ¿La escala de un gráfico se representa de manera diferente o algo así? ¿Cómo obtiene su ancho y alto exactos?