MaJ previsionnelle pour V 2.0

**fausto** · 02/05/2012, 14h08

Bonjour,

En prévision de la future migration, j'ai suivi les recommandations de :

https://api.ign.fr/geoportail/api/do...eur/setup.html

Jusqu'à la fin de l'étape 3, le code suivant (inséré en bas du "body") fonctionne :

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
<!-- *********************** GEOPORTAIL IGN ****************************** -->
 <script type="text/javascript" src="http://api.ign.fr/geoportail/api/js/1.3/Geoportal.js" charset="utf-8"></script>
<script type="text/javascript"><!--//--><![CDATA[//><!--
  
 <!-- DEFINIR le chargeur de contrat : -->
 if (window.__Geoportal$timer===undefined) {
     var __Geoportal$timer= null;
 }
 
function checkApiLoading(retryClbk,clss) {
    if (__Geoportal$timer!=null) {
      //clearTimeout: annule le minuteur "__Geoportal$timer" avant sa fin
      window.clearTimeout(__Geoportal$timer);
      __Geoportal$timer= null;
    }
  /**
  * Il se peut que l'init soit exécuté avant que l'API ne soit chargée
  * Ajout d'un code temporisateur qui attend 300 ms avant de relancer l'init
  */
  var f;
  for (var i=0, l= clss.length; i<l; i++) {
      try {
        f= eval(clss[i]);
      } catch (e) {
        f= undefined;
      }
    if (typeof(f)==='undefined') {
      __Geoportal$timer= window.setTimeout(retryClbk, 300);
      return false;
    }
  }
  return true;
 }

 function loadAPI() {
   // on attend que les classes soient chargées
   if (checkApiLoading(loadAPI,['OpenLayers','Geoportal','Geoportal.Viewer','Geoportal.Viewer.Default'])===false) {
     return;
   }
   // on charge la configuration de la clef API, puis on charge l'application
   Geoportal.GeoRMHandler.getConfig(['MY_CODE'], null, null, 
      {onContractsComplete: initGeoportalMap});
 }

VISU = null;

function initGeoportalMap() {
  OpenLayers.Lang.setCode('fr');

  VISU= new Geoportal.Viewer.Default(
       "GeoportalMapDiv",
       OpenLayers.Util.extend({
           mode:"normal",
           territory:"FXX",
           projection:null,
           displayProjection:['IGNF:RGF93G'],
/            proxy:PROXY
       }, gGEOPORTALRIGHTSMANAGEMENT || {})
   );

    zoomWheelEnabled(false);
    
     // hide navigation control (pan and zoom box) :
    c= VISU.getMap().getControlsByClass('Geoportal.Control.NavToolbar');
    if (c.length>0) {
      c= c[0];
      // c.deactivate(); désactive le déplacement par le drag de la souris
      c.div.style.display= 'none';
    }
    c= null;
    
    
    if (VISU.getMap().allowedGeoportalLayers) {
    
      // Affichage d'une "patience" pendant le téléchargement
      VISU.getMap().addControl(new OpenLayers.Control.LoadingPanel());

      // Opacité des cartes scannées (exemple : 0.8 ou 1.0)    
      VISU.addGeoportalLayer('GEOGRAPHICALGRIDSYSTEMS.MAPS:WMSC',{opacity:1.0});
      
      // "Altitudes" affichées (true=oui  false=non)    
    //   VISU.addGeoportalLayer('ELEVATION.SLOPS:WMSC',{visibility:false});
  
      // onglet "couches" développé
      VISU.openLayersPanel(false);
      // onglet "couches" affiché
      VISU.setLayersPanelVisibility(false);
      
      // onglet "outils"
      VISU.setToolsPanelVisibility(true);
      // onglet "outils" développé     
      VISU.openToolsPanel(false);
      
      // masque le panel d'information
      VISU.setInformationPanelVisibility(false);
      
      // positionnement : indiquer le point central de la carte
      VISU.getMap().setCenterAtLonLat(startingPoint.lon, startingPoint.lat, 14);
      
      
        VISU.getMap().events.register(
          "click",
          VISU.getMap(),
          function(e) {
            var pos = VISU.getMap().getLonLatFromViewPortPx(e.xy);
            // à tout moment on récupère les coordonnées de la souris
            pos.transform(VISU.getMap().getProjection(), VISU.getMap().displayProjection);
            $("#projection_lat, #projection_lon, #projection_ign").empty();
            //si on souhaite l'affichage des infos de projection
             if(document.forms.a.checkInfoClick.checked){
            $("#projection_lat").html('Latitude&nbsp;:&nbsp;<font color="#0066CC">' + pos.lat.toFixed(6) + '</font>');
            $("#projection_lon").html('Longitude&nbsp;:&nbsp;<font color="#0066CC">' + pos.lon.toFixed(6) + '</font>');
            $("#projection_ign").html('Carte(s) IGN&nbsp;:&nbsp;<br />' + getmapInfos(pos.lat, pos.lon));
            $("#projection").show();
          } else {
            $("#projection").hide();
            }
             return false;
          } 
        );

    }
    // alert(VISU.getMap().allowedGeoportalLayers.length);

}
  
window.onload= loadAPI;
 //--><!]]>
</script>

Par contre à l'étape 4, le code suivant affiche une carte vide :

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
  <!-- *********************** GEOPORTAIL IGN ****************************** -->
  <script type="text/javascript" src="http://api.ign.fr/geoportail/api/js/1.3/Geoportal.js" charset="utf-8"></script>
  <script type="text/javascript"><!--//--><![CDATA[//><!--
    
  // AJOUT de la variable qui va recevoir l'interface de visualisation (facilite le deboggage) :
        var iVIEWER= null;

        // INSERTION du chargeur :
        function loadAPI() {
            // DÉPLACEMENT des lignes avant l'appel à Geoportal.Viewer.Default :
//    OpenLayers.Lang.setCode('fr');
            
            // les options proviennent du constructeur Geoportal.Viewer.Default :
            iVIEWER= new Geoportal.load(
                "GeoportalMapDiv",
                // la ou les clefs :
                ['MY_CODE'],
                null,
                null,
                {
                    mode:"normal",
                    territory:"FXX",
//                    projection:null,
                    displayProjection:['IGNF:RGF93G'],
                    // ATTENTION, l'option s'appelle proxyUrl et non proxy :
//                    proxyUrl:PROXY,
                    // UTILISATION du visualiseur par défaut :
                    viewerClass:Geoportal.Viewer.Default,
                    // APPEL à initGeoportalMap pour terminer le travail :
                    onView: initGeoportalMap,
                    // On met ici les noms des couches tels qu'ils apparaissaient dans le premier paramètre de l'appel à addGeoportalLayers() :
                    layers:[
                        'GEOGRAPHICALGRIDSYSTEMS.MAPS'
                    ],
                    // On met éventuellement ici les options des couches Géoportail telle qu'elles apparaissaient dans le second paramètre de
                    // l'appel à addGeoportalLayers() :
                    layersOptions:{
                        'GEOGRAPHICALGRIDSYSTEMS.MAPS':{opacity:1.0}
                    }
                }
            );
//console.log(iVIEWER);            
        }

  var VISU = null;

  function initGeoportalMap() {
//    OpenLayers.Lang.setCode('fr');

    VISU= iVIEWER.getViewer();
console.log(VISU);            


      zoomWheelEnabled(false);
      
       // hide navigation control (pan and zoom box) :
      c= VISU.getMap().getControlsByClass('Geoportal.Control.NavToolbar');
      if (c.length>0) {
        c= c[0];
        // c.deactivate(); désactive le déplacement par le drag de la souris
        c.div.style.display= 'none';
      }
      c= null;
      
      
      if (VISU.getMap().allowedGeoportalLayers) {
      
        // Affichage d'une "patience" pendant le téléchargement
        VISU.getMap().addControl(new OpenLayers.Control.LoadingPanel());
  
        // Opacité des cartes scannées (exemple : 0.8 ou 1.0)    
        VISU.addGeoportalLayer('GEOGRAPHICALGRIDSYSTEMS.MAPS:WMSC',{opacity:1.0});
        
        // "Altitudes" affichées (true=oui  false=non)    
      //   VISU.addGeoportalLayer('ELEVATION.SLOPS:WMSC',{visibility:false});
   
        // onglet "couches" développé
        VISU.openLayersPanel(false);
        // onglet "couches" affiché
        VISU.setLayersPanelVisibility(false);
        
        // onglet "outils"
        VISU.setToolsPanelVisibility(true);
        // onglet "outils" développé     
        VISU.openToolsPanel(false);
        
        // masque le panel d'information
        VISU.setInformationPanelVisibility(false);
        
        // positionnement : indiquer le point central de la carte
        VISU.getMap().setCenterAtLonLat(startingPoint.lon, startingPoint.lat, 14);
        
        
         VISU.getMap().events.register(
           "click",
           VISU.getMap(),
           function(e) {
             var pos = VISU.getMap().getLonLatFromViewPortPx(e.xy);
             // à tout moment on récupère les coordonnées de la souris
             pos.transform(VISU.getMap().getProjection(), VISU.getMap().displayProjection);
             $("#projection_lat, #projection_lon, #projection_ign").empty();
             //si on souhaite l'affichage des infos de projection
              if(document.forms.a.checkInfoClick.checked){
              $("#projection_lat").html('Latitude&nbsp;:&nbsp;<font color="#0066CC">' + pos.lat.toFixed(6) + '</font>');
              $("#projection_lon").html('Longitude&nbsp;:&nbsp;<font color="#0066CC">' + pos.lon.toFixed(6) + '</font>');
              $("#projection_ign").html('Carte(s) IGN&nbsp;:&nbsp;<br />' + getmapInfos(pos.lat, pos.lon));
              $("#projection").show();
            } else {
              $("#projection").hide();
             }
              return false;
           } 
         );

      }
      // alert(VISU.getMap().allowedGeoportalLayers.length);
    }
    
  window.onload= loadAPI;
  //--><!]]>
  </script>

Pas de message d'erreur de firebug.
Geoportal.load() fonctionne car le premier console.log(iVIEWER) montre bien on objet.
Par contre, aucune nouvelle du second console.log dans initGeoportalMap() (idem avec un message alert).
Il semblerait donc que initGeoportalMap() ne soit pas appelée.
Une idée de la raison ?
Y a-t-il un mode debug possible ?

Merci de votre aide

**mga_geo** · 02/05/2012, 14h24

Une page d'essai facilite grandement le debug, et les serveurs "perso" type alwaysdata sont accessibles à tous en quelques secondes.

**fausto** · 02/05/2012, 18h31

Merci de votre réponse rapide.

Je ne m'étais jamais renseigné sur l'existence d'hébergements gratuits, mais
voilà qui est fait.

Voici la version qui fonctionne :
http://allobobo.hebergratuit.com/index_ok.html

et celle qui ne fonctionne pas :
http://allobobo.hebergratuit.com/index_pas_ok.html

J'ai purgé le maximum, notamment tout ce qui nécessitait un accès aux bases de données.

**mga_geo** · 03/05/2012, 00h13

Plutôt que 2 "null" , il faudrait spécifier le centrage et le zoom:

{// map's center :
// longitude:
lon:2.731525,
// latitude:
lat:45.833333,
},
//zoom
14,

mais cela ne va certainement pas suffire ...

**dgrichard** · 08/05/2012, 16h01

Plusieurs petites remarques :

1/ tes pages ne respectent pas les CGU : il est interdit de masquer le logo Géoportail et les CGU elles-mêmes

2/ dans la seconde page :

Code :

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

1
2
if (VISU.getMap().allowedGeoportalLayers) {

est toujours faux, donc le code à l'intérieur n'est jamais exécuté (ce qui n'est plas plus mal car il refait en grande partie ce que fait déjà Geoportal.load()) et startingPoint n'est pas défini ...

3/ Ce sont les CSS déclarées en début de page 2 qui bloquent le chargement en particulier celles qui touchent à padding-bottom de gpControlInformation

Code :

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

1
2
padding-bottom: 10px !important;

On peut se demander pourquoi toucher aux CSS quant le code fait ceci:

Code :

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

1
2
VISU.setInformationPanelVisibility(false);

4/ D'ailleurs quant on veux surcharger les styles de l'API, la bonne pratique c'est de charger "à la main" les styles, puis de les surcharger : on utilise !important quant on n'a pas le choix ...

5/ Enfin, tu charges JQuery, alors utilise :

Code :

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

1
2
3
4
    $(document).ready(function() {
        loadAPI();
    });

et non :

Code :

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

1
2
window.onload= loadAPI;

5/

**fausto** · 12/05/2012, 09h39

Bonjour,

Merci pour ces précieuse informations dgrichard.
Une simple suppression des styles de la page et la carte s'affiche, confirmant ainsi ton diagnostic.
Je dois reconnaître que jusqu'à un récent passé, je n'avais pas mis le nez dans ce code qui a été écrit par le précédent webmaster du site dont je m'occupe, et que je découvre l'API IGN.

Je vais mettre tes conseils à profit ( et remettre le logo

)

MaJ previsionnelle pour V 2.0

IGN API Géoportail

Discussions similaires

Partager

Partager