+- 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 : Javascript et les maths (/showthread.php?tid=986)
Javascript et les maths - Sephi-Chan - 29-03-2007
Salut à tous
Je suis toujours à bosser sur mon système de cartes, et je me heurte à un problème assez mathématique, or ma passion pour les maths est... modérée.
Voici donc mon problème :
![[Image: mapqh7.png]](http://img261.imageshack.us/img261/2739/mapqh7.png)
Chaque case est un TD dont l'id est égal au nombre indiqué sur la case.
Lorsqu'un joueur click sur une unité (ici symbolisée par un X), une fonction Javascript est exécutée. En voici les paramètres :
selectArea(idUnit, mUnit, mapLength){}
- idUnit n'à ici aucune importance, on dira que c'est 1.
- On dira que l'unité X a 2 en mouvement Munit, c'est à dire qu'elle peut bouger de 2 cases (elle peut donc couvrir toute la zone que je montre).
- MapLenght vaut ici 5.
Je n'arrive pas à trouver comment faire ma fonction, c'est pourquoi j'en appelle à vous.
Elle doit modifier l'image de fond (en Javascript, grâce à style.backgroundColor = 'red'; ) de chaque case à portée.
Mais voila, je n'arrive pas à créer cette boucle.
J'espère que vous pourrez m'aider et vous en remercie d'avance.
Sephi-Chan
RE: Javascript et les maths - NicoMSEvent - 29-03-2007
donc, si X = 12 et mapLength=5 et mUnit=2
la zone couverte devrait etre entre X-mUnit et X+mUnit
et entre X-(mapLength*mUnit) et X-(mapLength*mUnit)
Pour éviter que quand tu es en bord de carte, ta zone ne s'étende de l'autre coté de la carte (comme si par exemple tu fesais le tour de la terre), tu dois rajouter la condition
pour les cotés :
si modulo(X,mapLength)-mUnit >=0 et modulo(X,mapLength)+mUnit<mapLength
pour la hauteur :
si X-(mapLength*mUnit) >=0 et X+(mapLength*mUnit)<mapLength*mapLength
voilà pour la logique... comme je ne suis pas trop fort en javascript, je vais te laisser traduire ça
en espérant que ça te donne un coup de pousse
RE: Javascript et les maths - Sephi-Chan - 29-03-2007
Merci bien NicoMSEvent.
J'essaie de cerner un peu (en faisant abstraction des 2 dernières formules) mais je me rend compte de deux choses :
- La seule formule X-(mapLength*mUnit) et X-(mapLength*mUnit) suffit, puisqu'elle englobe également les cases données par la première.
- Il manque des cases, celles d'id 0, 1, 23 et 24.
En tout cas, merci pour ton aide, tu me sauves. ^^
Et, rassure-toi, tu n'es pas le seul à être moyen en Javascript non plus. J'ai appris à m'en servir en créant mon éditeur de cartes il y à quelques jours, donc sur le tas. :p
Sephi-Chan, qui, à 11h30, part pour 1 heure de maths et 4 heures de méca :'(
RE: Javascript et les maths - Sephi-Chan - 29-03-2007
Merci beaucoup Roworll, je vais lire ça tranquillement pour bien comprendre, puis je ferais des essais.
Merci vraiment à vous deux !
Sephi-Chan, enjoy
RE: Javascript et les maths - Roworll - 29-03-2007
Je remets mon code, j'avais oublié les débordements droite gauche.
J'ai ajouré la variable pUnit qui est l'id de la case ou se trouve l'unité
Code PHP :
<?php
<script language="javascript">
selectArea(idUnit, mUnit, pUnit, mapLength){}
// On repère ligne la plus haute correspondant à la case traitée
var cRow = pUnit - ((mapLength)*mUnit);
// Boucle sur les ligne
for(var x=-mUnit;x<=mUnit;x++){
//Boucle sur les colonnes
for(var y=-mUnit;y<=mUnit;y++){
//Recup de l'Id à traiter
var cId = cRow+y;
//on vérifie les débordements droite/gauche
if(parseInt(cId/mapLength)==parseInt(cRow/mapLength)){
//Coloriage de la case incluant le test d'existence pour le débordement haut bas
if(loc=document.getElementById(cId)) loc.style.backgroundColor='red';
}
}
// Ligne suivante
cRow+=mapLength;
}
}
</script>
Code teste et validé sur une carte 10x10 avec une capacité de déplacement de 1 puis 2 puis 3 cases et en faisant varier la position de l'unité.
RE: Javascript et les maths - Roworll - 29-03-2007
Petite variante pour afficher une matrice de déplacement qui n'autorise pas les diagonales :
Code PHP :
<?php
<script language="javascript">
selectArea(idUnit, mUnit, pUnit, mapLength){}
// On repère ligne la plus haute correspondant à la case traitée
var cRow = pUnit - ((mapLength)*mUnit);
// Boucle sur les ligne
for(var x=-mUnit;x<=mUnit;x++){
//Boucle sur les colonnes
for(var y=-mUnit;y<=mUnit;y++){
//La case est elle à portée ?
if(Math.abs(x)+Math.abs(y)<=mUnit){
//Recup de l'Id à traiter
var cId = cRow+y;
//on vérifie les débordements droite/gauche
if(parseInt(cId/mapLength)==parseInt(cRow/mapLength)){
//Coloriage de la case incluant le test d'existence pour le débordement haut bas
if(loc=document.getElementById(cId)) loc.style.backgroundColor='red';
}
}
}
// Ligne suivante
cRow+=mapLength;
}
}
</script>
RE: Javascript et les maths - Sephi-Chan - 30-03-2007
Merci beaucoup Roworll ! Je vais tester tout ça et l'adapter encore un peu à mes besoins
.Sephi-Chan, je te dois une fière bretelle !