+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : Collision de deux éléments de 5x5 (/showthread.php?tid=3728)
Collision de deux éléments de 5x5 - orditeck - 25-02-2009
Bonsoir à tous,
voici mon problèmes : j'aimerais savoir quand deux blocs de 5x5 se touchent, peu importe où. Exemple :
![[Image: 2009-02-24_2245.png]](http://www.klteck.net/uploads/2009-02-24_2245.png)
Je ne sais pas si vous comprenez bien, si vous avez des questions pour mieux me faire comprendre, n'hésitez-pas.
Merci d'avance
RE: [JS] Collision de deux éléments de 5x5 - Ter Rowan - 25-02-2009
je suppose que tu as la taille des "carrés"
on a donc le carré 1 (x1, y1, t1) et le carré 2 (x2, y2, t2)
x = left
y = top
t = taille (évidemment tu peux avoir l et h si ce ne sont pas des carrés, pour d'autres polygones, faudra travaillé))
pour moi il y a quatre tests à faire, en prenant pour pivot le carré 1, à savoir s'assurer que les quatre sommets de carré 2 ne sont pas dans carré 1
je vais le faire en protojavascript pour aller plus vite (et partir a la douche avant d aller bosser ^^)
Code PHP :
<?php
function sommetDansCarre ( x, y, carrePivot)
{
if ( (x >= carrePivot.x) &&
( x <= carrePivot.x+ carrePivot.t) &&
(y>= carrePivot.y) &&
( y< = carrePivot.y+carrePivot.t) )
return true;
else return false;
}
function Collision (Carre2, Carre1)
{
if ( sommetDansCarre (Carre2.x, Carre2.y, Carre1) ||
sommetDansCarre (Carre2.x + Carre2.t, Carre2.y, Carre1) ||
sommetDansCarre (Carre2.x, Carre2.y + Carre2.t, Carre1) ||
sommetDansCarre (Carre2.x + Carre2.t, Carre2.y + Carre2.t, Carre1) )
return true;
else return false;
}
ca devrait suffire, si j'ai bien compris ta demande ^^
RE: [JS] Collision de deux éléments de 5x5 - orditeck - 25-02-2009
Merci beaucoup pour ta réponse complète !
Il y a seulement une chose que je saisie pas bien : la taille.
Étant donné que mes carrés font 5px par 5px, la taille devrait être 25px, je me trompe ?
Pourrais-tu me le confirmer s'il te plait ?
RE: [JS] Collision de deux éléments de 5x5 - Ter Rowan - 25-02-2009
non non, c'est 5
j'ai essayé de le rendre un petit peu plus générique mais raté a priori ^^
tu es sur des carrés de 5 de côté donc c'est entre x et x+5
(25 c'est la surface)
RE: [JS] Collision de deux éléments de 5x5 - orditeck - 25-02-2009
Je suis certain que c'est très clair pour toi et je m'excuse pour mon manque flagrant de logique, mais je n'arrive pas à le faire fonctionner.
Voici le code (en JS, bien entendu) :
Code PHP :
<?php
function sommetDansCarre (x, y, carrePivot){
if ( (x >= carrePivot.style.left) && ( x <= carrePivot.style.left + 5) && (y >= carrePivot.style.top) && ( y <= carrePivot.style.top + 5) ){
return true;
}else{
return false;
}
}
function Collision (Carre2, Carre1){
if (sommetDansCarre (Carre2.style.left, Carre2.style.top, Carre1) || sommetDansCarre (Carre2.style.left + 5, Carre2.style.top, Carre1) || sommetDansCarre (Carre2.style.left, Carre2.style.top + 5, Carre1) || sommetDansCarre (Carre2.style.left + 5, Carre2.style.top + 5, Carre1) ){
return true;
}else{
return false;
}
}
Ensuite, la ligne ci-dessous devrait me dire si oui ou non je fais une collision. J'ai testé, et ça semble seulement fonctionner quand les deux Left sont identiques et que je passe dessus via le Top (donc que je suis aligné à lui verticalement et que je passe ensuite horizontalement)
Code PHP :
<?php
if(Collision(document.getElementById('morceau'), document.getElementById('joueur'))){
alert("Collision");
}
RE: [JS] Collision de deux éléments de 5x5 - orditeck - 25-02-2009
Lien :
http://ecole.orditeck.com/snake/jeu.html
RE: [JS] Collision de deux éléments de 5x5 - Ter Rowan - 25-02-2009
je ne comprends pas
j'ai refait le truc sur papier ça m'a l air correct pourtant
à moins que... est ce qu'on est bien d'accord que si le coin gauche haut de la page est bien (0,0) ? (j'ai comme un doute maintenant)
à noter je n'ai pas réussi à lancer ta page de test j'ai un bug javascript (au bureau sur ie) je vais essayer à la maison sur ff
sinon j'ai raté un truc j'en suis sûr, ce n'est pas taille mais taille -1 (donc 4) à mettre car si un carré à 5 de largeur et que le côté gauche est positionné en 10 alors le côté droit est positionné en 14 et pas en 15 ^^
RE: [JS] Collision de deux éléments de 5x5 - Ter Rowan - 25-02-2009
comme il est vilain ^^
le problème ne vient pas de l'algo (j'ai cherché un peu) mais du fait que
carrePivot.style.left renvoie une chaine de caractères de type "160px"
j'ai fait un test ça a l air de marcher :
Code PHP :
<?php
<html>
<body>
<div id='c1' style="position : absolute; left: 88px; top: 160px; background:#f00; width:100px; height:100px" >c1</div>
<div id='c2' style="position : absolute; left: 98px; top: 180px; background:#0f0; width:100px; height:100px;">c2</div>
<div id='c3' style="position : absolute; left: 308px; top: 160px; background:#88f; width:100px; height:100px;">c3</div>
<script>
function sommetDansCarre (x, y, carrePivot)
{
if ( ( parseInt(x) >= parseInt(carrePivot.style.left) ) &&
( parseInt(x) <= parseInt(carrePivot.style.left) + parseInt(carrePivot.style.width) -1) &&
( parseInt(y) >= parseInt(carrePivot.style.top) ) &&
( parseInt(y) <= parseInt(carrePivot.style.top) + parseInt(carrePivot.style.height) -1) )
{
return true;
}
else
{
return false;
}
}
function Collision (Carre2, Carre1)
{
if (sommetDansCarre ( Carre2.style.left, Carre2.style.top, Carre1) ||
sommetDansCarre (Carre2.style.left + Carre2.style.width-1, Carre2.style.top, Carre1) ||
sommetDansCarre (Carre2.style.left, Carre2.style.top + Carre2.style.height-1, Carre1) ||
sommetDansCarre (Carre2.style.left + Carre2.style.width-1, Carre2.style.top + Carre2.style.height-1, Carre1) )
alert("collision entre "+Carre2.innerHTML+" et "+Carre1.innerHTML);
else
alert(" pas de collision entre "+Carre2.innerHTML+" et "+Carre1.innerHTML);
}
Collision( document.getElementById('c2'), document.getElementById('c1') );
Collision( document.getElementById('c1'), document.getElementById('c3') );
Collision( document.getElementById('c3'), document.getElementById('c2') );
</script>
</body>
</html>
RE: [JS] Collision de deux éléments de 5x5 - Anthor - 25-02-2009
http://www.dynamicdrive.com/dynamicindex12/snake/index.htm
RE: [JS] Collision de deux éléments de 5x5 - orditeck - 25-02-2009
Je veux pas du tout fait non plus héhé, je veux quand même que ce soit un petit défi pas trop long (disons que ce que je fais, déjà, est de loin supérieur au travail demandé... le cour est assez simple.)
Merci beaucoup Ter Rowan, je vais tester ça aussitôt que possible et je te donne des nouvelles