Foro de elhacker.net

Tengo una pregunta como evitar que se encimen objetos en JS, bueno tengo un generador que cada cierto tiempo regenera un recuadro aleatoria mente con la función random pero quisiera evitar que se encimen porque a veces se pone uno sobre otro.

esto se llama "colision de elementos", usado sobre todo en juegos

puedes hacerlo con el bounding rect de el elemento (el rectangulo) un ejemplo

 
function detectar_colision(el1, el2) {
    return !(el1.right < el2.left || 
                el1.left > el2.right || 
                el1.bottom < el2.top || 
                el1.top > el2.bottom)
}
 
var elemento1 = document.getElementById("elemento1").getBoundingClientRect();
var elemento2 = document.getElementById("elemento2").getBoundingClientRect();
 
 
 
if( detectar_colision(elemento1, elemento2)){
 
  hacer_algo()
}
 

Ya eh intentado carias formas con tu función que me brindaste y funciona me detecta cuando se juntan 2 objetos, pero de una forma y otra intente hacer que no aparecieran los que se juntaran, pero dejan de aparecer todos y no me genera nada pero ya encontré el error y ahora estoy intentando solucionarlo pero voy a las matemáticas xd intentare hacer los calculos igualmente gracias

egenerados[i].x=random(canvas.width/40)*40;

No dijiste que era canvas este método es por ejemplo para elementos div span y esos

Con razon igual intentare solucionarlo pero si pudieses brindarme un poco de ayuda yo lo complementaria.

Primero aclara cuales son tus objetos, porque así no podemos saber cómo son o como hacer que interactuen

Mi objeto es una variable llamada egenerados que genera enemigos cada cierto tiempo o acción por ejemplo si elimino a un enemigo o pasan 5 segundos se generan aleatoriamente de posiciones horizontal

egenerados [i].x=random(canvas.width/40)*40;//10)*10;
                            egenerados [i].y=0;
                            egenerados [i].evida=2;
                            egenerados .push(new Rectangle(random(canvas.width/40)*40,0,40,40,0,2));