Discussion :

[dragonno]

Bonjour,

J'ai un problème accès à un attribut d'un objet mais je ne sais pas si c'est dû à ma façon de gérer l'objet ou à ma façon de gérer le tableau 2D ou bien encore à une variable publique, donc je vous expose le problème en bas de mon post.
Je ne sais pas quel attribut mettre entre HTML5 et juste javascript, car le problème n'est pas dû à l'API même j'utilise quand même une fois la fonction draw(), ça me semble être plus un problème de javascript objet qu'un problème d'API.

1) J'ai une classe Sol()
2) Après avoir créé l'objet de cette classe, je le place dans une case d'un tableau 2D, case référencée par les index celx,cely
3) J'ai une boucle qui vérifie l'attribut <stype> de l'objet présent dans chaque case du tableau 2D, afin de vérifier s'il contient bien la valeur placée (6), et dans ce cas un sol est dessiné sur le canvas

Le problème :
drawimage() semble me montrer (en dessinant le sol sur tout le canvas) que ce sol de valeur 6 est contenu dans toutes les cases du tableau 2D, hors je l'ai bien placé que dans une seule case, celle référencée par celx,cely dans la partie 2 de ce post.

[SylvainPV]

Peut-on avoir le code qui encadre la partie 2 ? La création des objets Sol, l'initialisation de celx et cely

[dragonno]

Oui bien sûr :

Création de l'objet sol :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
// Création de l'objet sol.
lesol=new Sol();

Pour l'initialisation des variables celx,cely c'est plus compliqué :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
// Calcule la position celx,cely en nombre de cases, de la case cliquée.
function positionne(event)
{
var x = event.clientX;
var y = event.clientY;
// Calcule la position col,lig (en pixels) du click sur le plan d'affichage.
var col=x-colplan;
var lig=y-ligplan;
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
function quel(event)
{
positionne(event);
if(event.which==1)
   {
   // Bouton gauche pressé : Dessine le tile sur la case du plan d'affichage.
   dessine(celx,cely);
   // Met le tile dans le tableau de la map.
   }
if (event.which==3)
   {
   // Bouton droit pressé
     for (i=0;i<15;i++)
     {
        for (j=0;j<15;j++)
        {
{ctxplan.drawImage(imgset,srcX,srcY,largimg,largimg,(i*32),j*32,largimg,largimg);}
        }
     }
   }
 
}

Je signale que le dessin de l'objet se fait correctement sur la bonne case de la map avec le click gauche, mais dés que j'utilise le click droit pour vérifier la présence des valeurs, ça dessine sur toute la map comme si le tableau était remplit de la valeur 6 dans l'attribut stype de l'objet.
C'est pour ça que je ne sais pas si ça vient de la boucle de dessin ou du tableau ou de l'objet ou encore de numtile qui est contient aussi la valeur 6 et qui est publique.
Numtile a servi lors du click gauche (positionne()) pour mettre la valeur dans la case cliquée (voir partie 2).

Il y a un effet qui peut peut-être donner des indices :
Quand je sélectionne un sol (le 6 ici) et que je fasse "click gauche" sur la map le sol se dessine bien sur la case cliquée, mais si après avoir sélectionné mon sol (ici le sol 6) je fait "click droit" au lieu du gauche, sur la map, alors il ne se passe rien, ni remplissage de la map ni dessin d'une case.
Quoique cet effet s'explique par la condition supérieur que j'ai mis dans la boucle de la fonction draw().
Mais ça n'explique pas pourquoi la map est entierement remplie du sol quand je clique du droit apres avoir cliqué du gauche sur la map.

[SylvainPV]

Il y a des problèmes de scope, tes variables celx et cely sont globales donc elles valent la même chose partout. A lire : http://syllab.fr/projets/web/exposejs/#9

Aussi return celx,cely; est impossible en JS, on ne renvoie qu'une seule variable.

[dragonno]

Aaaah je te remercie beaucoup pour ces infos !

Je vais tester

Je suppose que si je veux envoyer en retour celx et cely en même temps, il va me falloir les mettre en un petit tableau ou un petit objet.

[SylvainPV]

Exact :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
return {
   celx: 1,
   cely: 2
};