Discussion :

[elvan49]

Bonjour à tous,
J'ai beau chercher sur divers tuto (comme : http://google-maps-api-version-3.touraineverte.com) et sur ce forum. Je n'ai pas trouvé dans mon code ce qui fait que
- j'affiche bien ma carte
- j'affiche bien mes markers (étapes)
- j'affiche bien mon itinéraire texte
mais
- je n'affiche pas le tracé bleu sur la carte de cet itinéraire.

Je vous livre le code d'initialisation et de rendu il est en js noyé dans du php. C'est un peu complexe j'en conviens mais je ne peux sortir de cette trame. c'est très certainement dans mes lignes js que le bas blesse.

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
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<?php 
if(isset($_SESSION['tunnel']['coord_d']) && isset($_SESSION['tunnel']['coord_a']) && isset($marker)){
 
 
    $my_coord_d = explode(",",str_replace(")", "", str_replace("(", "", $_SESSION['tunnel']['coord_d'])));
    $my_coord_a = explode(",",str_replace(")", "", str_replace("(", "", $_SESSION['tunnel']['coord_a'])));
 
//$key = index de tableau  si +1 = nbr de solutions (ex 1 = 2 solutions [0] et [1])
    for($i=0;$i<=$key;$i++){
        echo "var map_tc".($i+4).";\n";
        echo "var traceParcours".($i+4).";\n";
        echo "var marker_tc_d".($i+4).";\n";
        echo "var marker_tc_a".($i+4).";\n";
        echo "var direction".($i+4).";\n";
        echo "var panel".($i+4).";\n";
 
        foreach($marker[$i] as $j=>$m){
            //echo $m['lat'];
            echo "var marker_tc".$i.$j.";\n";
        }
    }
?>
 
 <?php for($i=0;$i<=$key;$i++){ ?>
 
function initialize_tc<?php echo $i+4; ?>(){
 
    var myOpt_tc3 = {
            zoom : 11,
            center : {
                    lat : <?php echo $my_coord_d[0]; ?>,
                    lng : <?php echo $my_coord_d[1]; ?>
            },
            type : 'ROADMAP', 
            deplacement:50,
            navigationControlOptions: {
                style: google.maps.NavigationControlStyle.SMALL,
                position: google.maps.ControlPosition.TOP_LEFT
                 },
             streetViewControl: false
 
    };
    var myControl_tc3 = {
            hidden : false,
            scale: false,
            type : false,
            dragable: true,
            dblClickZoom: false,
            scrollwheel: true
 
    };
     var myOpt_tc_d = {
            lat : <?php echo $my_coord_d[0]; ?>, 
            lng : <?php echo $my_coord_d[1]; ?>,
            title : 'Départ',
            img: 'images/icons/dep_marker.png',
            width:37,
            height:48,
            ancreX : 0,
            ancreY : 48,
            infoBulle : {
                    text : "<div id='map_popup'><div class='croixFermeture' onclick='marker_tc4.bulle.setMap(null)'>x</div>Départ</div>",
                    ancreX : 12,
                    ancreY : 40
            }
    };
    <?php 
            echo 'map_tc'.($i+4).' = new Map("cs_map_'.($i+1).'", myOpt_tc3, myControl_tc3);';
            echo "marker_tc_d".($i+4)." = map_tc".($i+4).".addMarker(myOpt_tc_d);";
            foreach($marker[$i] as $j=>$m){
     ?>
 
    var myOpt_tc<?php echo $i.$j; ?> = {
            lat :<?php echo $m['lat']; ?>, 
            lng :<?php echo $m['long']; ?>,
            title : 'Magasin <?php echo $j+1; ?>',
            img: 'images/icons/ar_marker.png',
            width:37,
            height:48,
            ancreX : 35,
            ancreY : 48,
            infoBulle : {
                    text : "<div id='map_popup'><div class='croixFermeture' onclick='marker_tc4.bulle.setMap(null)'>x</div>Arrivée</div>",
                    ancreX : 12,
                    ancreY : 40
            }
    };
 
    marker_tc<?php echo $i.$j; ?> = map_tc<?php echo ($i+4); ?>.addMarker(myOpt_tc<?php echo $i.$j; ?>);
 
 
<?php  } ?>
 
}
 
 
function traceroute<?php echo ($i+4); ?>(){
 
            <?php 
            foreach($marker[$i] as $j=>$m){
                if($j==0){
                    $poly="{location: new google.maps.LatLng(".$m['lat'].", ".$m['long']."),stopover:true}";
                }else{
                    $poly.=", {location: new google.maps.LatLng(".$m['lat'].", ".$m['long']."),stopover:true}";
                } 
             } ?>  
    direction<?php echo ($i+4); ?> = new google.maps.DirectionsRenderer();
        var request = {
            origin:new google.maps.LatLng(<?php echo $my_coord_d[0]; ?>, <?php echo $my_coord_d[1]; ?>),
            destination:new google.maps.LatLng(<?php echo $my_coord_a[0]; ?>, <?php echo $my_coord_a[1]; ?>),
            waypoints: Array(<?php echo $poly; ?>),
            travelMode: google.maps.DirectionsTravelMode.DRIVING
        };
        var directionsService = new google.maps.DirectionsService();
        directionsService.route(request, function(response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                direction<?php echo ($i+4); ?>.setDirections(response);
                    var rendererOptions = {
                        hideRouteList: true
                    };
                    var dirRenderer = new google.maps.DirectionsRenderer(rendererOptions); 
                    dirRenderer.setMap(map_tc<?php echo ($i+4);?>);
                    dirRenderer.setPanel(document.getElementById('cs_iti_<?php echo ($i+1); ?>_content'));
                    dirRenderer.setDirections(response);
 
            }
        });
}
 
    <?php  } ?>    
 
<?php  } ?>

Merci d'avance de vos éclairages

[elvan49]

les affectations php c'est parce que selon les cas j'ai plusieurs solutions (en fait jusqu'à 3, d'où initialize_tc4, 5 ou 6 et traceroute4, 5 ou 6) donc plusieurs cartes à afficher en fonction de l'appel. Encore une fois le problème ne vient pas de ces appels ni des paramètres fournis...

[NoSmoking]

Bonjour,

Je vous livre le code d'initialisation et de rendu il est en js noyé dans du php

c'est là que le bas blesse, il nous faudrait le code HTML et JS généré par le PHP.

Un exemple sur http://www.developpez.net/forums/d11...oint-polygone/

[elvan49]

Donc à première vue il ne manque rien dans les fonctions intialize_tc et traceroute ?
Je peux copier le code html généré mais le js n'apparait pas (je te passe les détails... ajax...) le code généré par google est kilométrique... t'es sûr ?
Je pensais que ça pouvait être une méthode de l'api que j'aurais pu oublier...

[NoSmoking]

une fois la page affichée un CTR +U devrait faire apparaître le code HTML + JS généré.

Vérifies que le tracé est bien affecté à une map, ce que je n'arrive pas à deviner dans le code fourni, un truc du style :

Code :

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

1
2
  var traceRoute = new google.maps.DirectionsRenderer();
  traceRoute.setMap( oMap);

[elvan49]

Le code js n'est pas dans la page php. La carte est au départ dans un div vide qui est généré via ajax.jquery quand on appelle telle ou telle solution.
A chaque solution correspond une carte, pour le moment les cartes sont bien générées, les drapeaux apparaissent aux différentes étapes mais pas de tracé.
Donc :
le code php écrit un fichier js en fonction de la demande.
au début... le code commun (déclaration des variables avec le numéro de solution de 4 à 6)
puis les markers de la solution appelée
puis initialize_tc4() si c'est la 4 etc...
puis traceroute4() si c'est la 4.
En fin de traceroute on peut voir :

Code :

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

1
2
3
4
5
var dirRenderer = new
google.maps.DirectionsRenderer(rendererOptions);
dirRenderer.setMap(map_tc<?php echo ($i+4); ?>);
dirRenderer.setPanel(document.getElementById('cs_iti_<?php echo ($i+1);?>_content'));
dirRenderer.setDirections(response);

ou i+4 va correspondre à la solution, mais setPanel et setMap on l'air de pas s'entendre, car quand je décommente setMap (comme dans l'exemple ci-dessus) l'itinéraire texte ne s'affiche plus...

Est-ce que je suis plus clair comme ça. CTRL U ou webdeveloper-bar ne permettent pas d'afficher ce que tu demandes. J'ai bien essayé...