Discussion :

[gwalou]

Bonjour,

je vous explique un petit peu mon problème sur lequel je bloque depuis plusieurs jours.

Je souhaite faire une redirection au clique d'un objet raphael (une carte avec des communes).

Enfaite je souhaite que les communes ayant une maison a vendre soit cliquable et les autres non. Pour cela je récupère dans ma base de données les noms des communes ayant une maison. Je les envoie a mon script JavaScript par du json. Et pour finr je souhaiterais (c'est la ou ça coince) que les objets raphael (les communes) soit cliquable si leur nom apparait dans le tableau générer par mon php.

Je sais pas si c'est très clair car a force d'être dessus je saute peut être des étapes dans l'explication ^^.

je vous envoie mon code (que j'ai essayer de commenter avec le plus de pertinence possible.

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
 
 
window.onload = function() {
 
 
    //creation d'un objet raphael
    var R = Raphael("map", 800, 800);
 
    //creation d'un tableau regroupant 5 communes
    var carte = new Array(5);
 
    // creation d'un tableau 2d : 1ere case => nom de la ville , 2eme case => objet raphael permetant de la dessiner
    for(var i=0; i < carte.length; i++){
    carte[i]=new Array(2);
    }
 
    // attribut de couleur des objets raphaels
    var test=
    {
    stroke:"#53087a",
    "stroke-width": 2,
    fill: "#d81313"
    };
 
    //contenu du tableau carte
    carte[0][0]="plesse";
    carte[0][1] = R.path("M237,271.89 243.938,274.89 244.875,280.578 \n\t\t253.875,286.39 275.375,285.203 287.063,293.14 284.875,305.89 275.188,308.203 271.188,316.328 254.438,327.078 227.75,322.765 \n\t\t223.5,308.953 221.875,306.953 225.5,299.953 217.75,288.203 222.219,280.078 233.938,278.203 \tz").attr(test);  
    carte[1][0]="avessac";
    carte[1][1]= R.path("M244.125,274.89 237.031,271.765 233.938,278.203 \n\t\t222.219,280.078 197.094,270.234 195.719,256.953 207.938,249.765 208.219,243.171 223.531,231.89 224.469,239.14 233.438,240.109 \n\t\t245.5,250.703 251.344,259.515 \tz").attr(test);
    carte[2][0]="guemene_panfao";
    carte[2][1]= R.path("M245.5,250.703 261.688,246.203 259,231.515 \n\t\t268.313,227.39 276.5,237.078 284.063,234.89 286.813,237.828 280.313,244.703 294.625,260.828 296.875,271.765 309.688,277.765 \n\t\t304.5,295.515 287.063,293.14 275.125,285.39 253.875,286.39 244.875,280.578 243.938,274.89 251.344,259.515 \tz").attr(test);
    carte[3][0]="masserac";
    carte[3][1]= R.path("M259,231.515 261.688,246.203 245.5,250.703 \n\t\t233.417,240.39 246.333,232.474 \tz").attr(test);
    carte[4][0]="le_gavre";
    carte[4][1]=R.path("M287.063,293.14 305.5,295.765 301.5,322.515 \n\t\t295.875,332.015 261.375,337.89 254.438,327.078 271.188,316.328 275.188,308.203 284.875,305.89 \tz").attr(test);
 
 
 
    var k=0;
    console.log(array_commune);
    // le tableau array commune est un tableau generer par du php, envoyer en json puis parser. il retourne: array_commune=["plesse", "avessac", "guemene_panfao"];
 
    // savoir le nombre de ligne dans le tableau array_commune
    var row_in_commune = array_commune.length;
 
    //parcours des deux tableaux
    for (j=0; j<carte.length;j++)
    {
        for (r=0; r<row_in_commune; r++)
        {
            //tester si la commune existe dans le tableau array_commune
            if(array_commune[r] == carte[j][0])
            {
                 // si la commune existe, executer la fonction 'lien' avec son parametre au click de l'objet raphael en question
                carte[j][1].click=lien('commune.php?commune='+array_commune[r]);
 
            }
 
        }
 
    }
 
//fonction lien
function lien (params)
{
//window.location.href=params;
console.log(params);
}
 
};

[NoSmoking]

Bonjour,

carte[j][1].click=lien('commune.php?commune='+array_commune[r]);

as tu essayé

Code :

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

1
2
3
carte[j][1].click = function(event){
  // la fonction à exécuter
};

[gwalou]

On m'a conseiller de voire avec le système de closure de javascript

[NoSmoking]

Tout à fait, tu as au moins 2 façons de procéder
1- surchage de l'objet

Code :

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

1
2
3
4
carte[j][1].commune = array_commune[r]; // surcharge
carte[j][1].click = function(){
  lien('commune.php?commune='+this.commune;
};

2- création d'un contexte

Code :

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

1
2
3
4
5
(function( param){
  carte[j][1].click = function(){
      lien('commune.php?commune='+param;
    };
})( array_commune[r]); // passage en paramètre des données