Discussion :

[Gustry]

Bonjour,
Je suis en train de travailler avec l'API de géoportail en manipulant des traces GPS.
J'ai trouvé sur la doc de l'API l'option zoomToExtent qui permet de zoomer automatiquement sur une trace avec le bon zoom. Mais cette option ne fait qu'ajouter un bouton dans le gestionnaire de couches, comment faire pour que le centrage soit automatique au chargement de la carte géoportail ?

J'ai essayé plusieurs petites manipulations, mais sans succès.
Je suis preneur de doc, ou d'exemples.

Merci d'avance.

Gustry

[trukker]

Voici le code que m'a proposé mga_geo lorsque j'ai posé la question sur le forum :

Code :

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

1
2
3
gpx.events.register('loadend',gpx,function() {
        viewer.getMap().zoomToExtent(gpx.getDataExtent());
        });

Code :

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

viewer.getMap().zoomToExtent(gpx.getDataExtent()

est la fonction qui permet de centrer sur les données, et

Code :

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

gpx.events.register('loadend',gpx,function() {...});

vérifie que les données sont chargées avant de les centrer.

Tu aura sans doute à changer "viewer" le nom de la div geoportal et "gpx" le nom de la couche sur laquelle se trouve les données.

Voilà, j'espère que mes explications sont claires.

[mga_geo]

Didier a proposé ceci:

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
  gpxLayer = viewer.getMap().addLayer(
    "GPX",
    "trace gpx",
    "gpx_edite_v2.gpx",
    {
      visibility: true,
      opacity:0.8,
      styleMap: styleMap,
      eventListeners:{
        "loadend":function(){
          if (this.maxExtent) {
            this.map.zoomToExtent(this.maxExtent);
            this.setVisibility(true);
          }
        }
      }
    }
  );

[Gustry]

Et bien merci beaucoup à vous deux. Cela fonctionne bien, même si le chargement est un peu long ... Mais ce n'est pas grave. L'important, c'était le centrage !

Etienne

[mga_geo]

Alors un petit clic sur le bouton Résolu!

[dgrichard]

Alors un petit clic sur le bouton Résolu!

oui, oui

[jac83]

bonjour,
je déterre ce post car je n'arrive pas a mettre en œuvre la solution de Didier. J'ai une carte avec affichage d'un fichier gpx (voir ici) j'ai le code pour le centrage de la carte donné par Didier 4 posts plus haut , mais comment modifier le code d'affichage de ma carte avec la solution donnée par Didier? J'ai essayé mais je n'y suis pas arrivé . Un coup de main serait le bienvenu
cdlt jacques

[dgrichard]

mais comment modifier le code d'affichage de ma carte avec la solution donnée par Didier? J'ai essayé mais je n'y suis pas arrivé . Un coup de main serait le bienvenu

Cette portion de ton code :

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
...
// Styles spécifiques au tracé
     var style1 = new OpenLayers.StyleMap({
     "default": new OpenLayers.Style({
         strokeColor: '#ff0000',
         strokeWidth: 6,
     }),
     "select": new OpenLayers.Style({
         strokeColor: '#1318E6',
         strokeWidth: 6,
     })
   });
 //-----------------------------------------------------------------------
                var style1 = VISU.getMap().addLayer("GPX", "parcours", "seoune.gpx", {
     styleMap: style1,
     visibility: true,opacity:0.6
      });
 ...

gagnerait à être remplacée par celle-là :

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
...
// Styles spécifiques au tracé
     var style1 = new OpenLayers.StyleMap({
     "default": new OpenLayers.Style({
         strokeColor: '#ff0000',
         strokeWidth: 6/*,à retirer*/
     }),
     "select": new OpenLayers.Style({
         strokeColor: '#1318E6',
         strokeWidth: 6/*,à retirer*/
     })
   });
 //-----------------------------------------------------------------------
                var gpx1 = VISU.getMap().addLayer("GPX", "parcours", "seoune.gpx", {
     styleMap: style1,
     visibility: true,opacity:0.6,
    eventListeners:{
        "loadend":function(){
           if (this.maxExtent) {
             this.map.zoomToExtent(this.maxExtent);
             this.setVisibility(true);
           }
         }
    }
         }); ...

De plus, tu devrais passer en 1.2 :

Code :

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

1
2
<script type="text/javascript" src="http://api.ign.fr/geoportail/api/js/1.0/Geoportal.js"><!-- Evite erreur à l'actualisation avec IE8 --></script>

avec ça :

Code :

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

1
2
<script type="text/javascript" src="http://api.ign.fr/geoportail/api/js/1.2/Geoportal.js"><!-- Evite erreur à l'actualisation avec IE8 --></script>

[jac83]

bonsoir,
j'ai mis en place les correctifs indiqués ... mais j'ai du laisser le <strokeWidth:6,> sinon la trace n'apparaissait pas ??? Pour le reste mille mercis, ça marche et le centrage se fait nickel ... J'ai encore une question: j'aimerai que la trace qui s'affiche soit transparente dés l'affichage alors qu'elle ne l'est pas ... elle ne le devient que lorsque l'on bouge le curseur de transparence de la couche .
fichier corrigé ici
cordialement jacques

[dgrichard]

j'ai mis en place les correctifs indiqués ... mais j'ai du laisser le <strokeWidth:6,> sinon la trace n'apparaissait pas ???

Il faut enlever la virgule , derrière le 6 car cela provoque une erreur sous IE ...

elle ne le devient que lorsque l'on bouge le curseur de transparence de la couche

Effectivement, il faudrait tester :

Code :

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

1
2
gpx1.setVisibility(0.6);

mais, d'abord il faudrait modifier ceci :

Code :

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

1
2
<script type="text/javascript" src="http://api.ign.fr/geoportail/api?v=1.0&amp;key=3852015048644298313&amp;instance=VISU&amp;"> <!-- --> </script>

en cela :

Code :

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

1
2
<script type="text/javascript" src="http://api.ign.fr/geoportail/api?v=1.2&amp;key=3852015048644298313&amp;instance=VISU&amp;includeEngine=false&amp;"> <!-- --> </script>

car l'API est chargée 2 fois (1.2, puis 1.0) ...

[jac83]

re ...
merci pour la réactivité. j'ai vérifié le fonctionnement sur IE, en fait le titre de mon fichier .gpx provoquait aussi une erreur xml ... Pour la transparence ce que tu m'as proposé <gpx1.setVisibility(0.6);> n'est pas opérant (... ou je l'ai mal placé) j'ai essayé aussi un fillOpacity dans le styleMap mais ça ne marche pas non plus . Pour voir, j'ai aussi fait un essai avec le même fichier en .KML et là miracle la transparence est bien au rendez-vous ... . Si tu as une autre idée pour la transparence gpx ... sinon pas grave ça restera comme cela, l'essentiel étant le centrage sur la trace
rajouté: en fait mon kml est transparent à la base, c'est pour cela que la transparence fonctionne

[jac83]

bonjour,
après quelques recherhes, finalement j'ai trouvé une solution ... dans le styleMap je rajoute <strokeOpacity: 0.7,>.
ça fonctionne et c'est là.
merci encore pour le centrage de la carte sur la trace (...je ne sais pas comment verrouiller cette discussion?).
cordialement jacques