mise à jour / enrichissement de certains exemples SDK OL3

IGNF · Dec 21, 2017 · 55b46f8 · 55b46f8
1 parent 9a51b26
commit 55b46f8
Show file tree

Hide file tree

Showing 20 changed files with 77 additions and 83 deletions.
diff --git a/samples/ol3/ol3-geojson.html b/samples/ol3/ol3-geojson.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte avec une couche GeoJSON</h1>
+        <p>NB : le clic sur les features s'obtient par l'ajout du controle GetFeatureInfo (ici : caché et activé).</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 
@@ -24,7 +25,13 @@ <h1>Une carte avec une couche GeoJSON</h1>
                     y : 5097147
                 },
                 controlsOptions : {
-                    "layerSwitcher" : {}
+                    "layerSwitcher" : {},
+                     "getfeatureinfo" : {
+                         options : {
+                             auto : true,
+                             hidden : true
+                         }
+                     }
                 },
                 layersOptions : {
                     macoucheGeoJSON : {

diff --git a/samples/ol3/ol3-gpx.html b/samples/ol3/ol3-gpx.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte avec une couche GPX</h1>
+        <p>NB : le clic sur les features s'obtient par l'ajout du controle GetFeatureInfo (ici : caché et activé).</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-interaction.html b/samples/ol3/ol3-interaction.html
@@ -14,10 +14,11 @@
     </head>
     <body>
         <h1>Test de l'activation / desactivation des interactions</h1>
+        <p>Version 1.0 : bugs constatés : (1) Après activation puis desactivation de getfeatureinfo => erreur au clic. (2) activation / desactivation de la navigation au clavier ("keyboard") inopérante </p>
         <div id="eventsDiv">
             <input type="checkbox" name="draggable" onclick="toggle(this);"/>enable Mouse navigation<br/>
             <input type="checkbox" name="keyboard" onclick="toggle(this);"/>enable keybord navigation<br/>
-            <input type="checkbox" name="selectable" onclick="toggle(this);"/>enable feature selection<br/>
+            <input type="checkbox" name="getfeatureinfo" onclick="toggle(this);"/>enable feature selection<br/>
         </div>
         <div id="geoportalMap"></div>
 
@@ -39,13 +40,32 @@ <h1>Test de l'activation / desactivation des interactions</h1>
                 },
                 zoom : 14,
                 controlsOptions : {
-                    selectable : false
+                    getfeatureinfo : {
+                        options : {
+                            auto : true,
+                            // hidden : true,
+                            active : false
+                        }
+                    },
+                    draggable : false,
+                    keyboard : false
                 }
             });
             function toggle(elem) {
                 var controlsOptions = {} ;
-                controlsOptions[elem.name] = elem.checked
-                map.addControls(controlsOptions) ;
+                if ( elem.name == "getfeatureinfo" ) {
+                    controlsOptions[elem.name] = {
+                        options : {
+                            auto : true,
+                            active : elem.checked,
+                            // hidden : true
+                        } 
+                    } ;
+                    map.modifyControls(controlsOptions) ;
+                } else {
+                    controlsOptions[elem.name] = elem.checked
+                    map.addControls(controlsOptions) ;
+                }
             }
         </script>
     </body>

diff --git a/samples/ol3/ol3-kml-drawing.html b/samples/ol3/ol3-kml-drawing.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte affichant une couche KML</h1>
+        <p>NB : le clic sur les features s'obtient par l'ajout du controle GetFeatureInfo (ici : caché et activé).</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-kml.html b/samples/ol3/ol3-kml.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte affichant une couche KML</h1>
+        <p>NB : le clic sur les features s'obtient par l'ajout du controle GetFeatureInfo (ici : caché et activé).</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-local-config.html b/samples/ol3/ol3-local-config.html
@@ -18,7 +18,7 @@
     </head>
     <body>
         <h1>Test du paramètre configUrl</h1>
-        <h2>Config locale.</h2>
+        <p>La carte s'initialise à l'aide d'un fichier d'autoconfiguration local.</p>
         <div id="geoportalMap1"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-measures-without-toolbox.html b/samples/ol3/ol3-measures-without-toolbox.html
@@ -22,6 +22,7 @@
     </head>
     <body>
         <h1>Controles Mesures</h1>
+        <p>Ici, les outils de mesures sont positionnés dans une div indépendante de la carte (sans container).</p>
         <div id="geoportalMap">
           <div id="container-measure">
             <!-- HERE : widgets tools measures -->

diff --git a/samples/ol3/ol3-measures.html b/samples/ol3/ol3-measures.html
@@ -20,6 +20,7 @@
     </head>
     <body>
         <h1>Controles Mesures</h1>
+        <p>Ajout des outils de mesures dans leur container standard. Personnalisation des styles de tracé.</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-modifyLayers.html b/samples/ol3/ol3-modifyLayers.html
@@ -18,6 +18,7 @@
     </head>
     <body>
         <h1>Modify Layers</h1>
+        <p>Les trois boutons permettent d'agir sur les propriétés de chacune des couches à l'aide de la méthode modifyLayers().</p>
         <div id="geoportalMap"></div>
         <div id="BoutonDiv">
             <input type="button" name="export" onclick="modifyLayers();" value="modifiyLayers(null)"/><br/>

diff --git a/samples/ol3/ol3-projection.html b/samples/ol3/ol3-projection.html
@@ -13,6 +13,10 @@
             height: 400px;
             width: 600px;
           }
+          #geoportalMap3 {
+            height: 400px;
+            width: 600px;
+          }
         </style>
         <script src="../../dist/ol3/GpOl3-src.js"></script>
     </head>
@@ -24,6 +28,9 @@ <h2>CAS 1 : l'utilisateur veut afficher une carte en WebMercator.</h2>
         <h2>CAS 2 : l'utilisateur veut afficher une carte en WGS84.</h2>
         <p>La projection de la carte est EPSG:4326.</p>
         <div id="geoportalMap2"></div>
+        <h2>CAS 3 : l'utilisateur veut afficher une carte en EPSG:2154.</h2>
+        <p>La projection de la carte est EPSG:2154.</p>
+        <div id="geoportalMap3"></div>
         <script type="text/javascript">
             Gp.Map.load('geoportalMap1',{
                 apiKey : "jhyvi0fgmnuxvfv0zjzorvdn",
@@ -51,6 +58,19 @@ <h2>CAS 2 : l'utilisateur veut afficher une carte en WGS84.</h2>
                 }
             });
 
+            Gp.Map.load('geoportalMap3',{
+                apiKey : "jhyvi0fgmnuxvfv0zjzorvdn",
+                projection : "EPSG:2154",
+                layersOptions : {
+                    'maCoucheWMS' : {
+                        format : "wms",
+                        title : "Cours d'eau",
+                        url : "http://services.sandre.eaufrance.fr/geo/zonage",
+                        layers : ["TronconHydrographique"]
+                    }
+                }
+            });
+
         </script>
     </body>
 </html>
diff --git a/samples/ol3/ol3-removeLayers.html b/samples/ol3/ol3-removeLayers.html
@@ -18,6 +18,7 @@
     </head>
     <body>
         <h1>removeLayers</h1>
+        <p>Les trois boutons permettent de retirer des couches à l'aide la méthode removeLayers()</p>
         <div id="geoportalMap"></div>
         <div id="BoutonDiv">
             <input type="button" name="export" onclick="removeLayers();" value="Remove(null)"/><br/>

diff --git a/samples/ol3/ol3-wfs-geoportail.html b/samples/ol3/ol3-wfs-geoportail.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Affichage couche WFS Géoportail</h1>
+        <p>En mode : "couche externe"</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 
@@ -28,7 +29,8 @@ <h1>Affichage couche WFS Géoportail</h1>
                     "ORTHOIMAGERY.ORTHOPHOTOS" : {},
                     maCoucheWFS : {
                         format :"wfs",
-                        url : "http://wxs.ign.fr/kgco926a9mj4fcng4whjf5ac/geoportail/wfs",
+                        // TODO : changer la clef ?
+                        url : "https://wxs.ign.fr/kgco926a9mj4fcng4whjf5ac/geoportail/wfs",
                         typeNames : "BDPARCELLAIRE-VECTEUR_WLD_BDD_WGS84G:parcelle",
                         version : "2.0.0",
                         // version : "1.1",

diff --git a/samples/ol3/ol3-wfs.html b/samples/ol3/ol3-wfs.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte avec une couche WFS</h1>
+        <p>TODO : revoir le serveur WFS ou les features utilisés ("Error occurred getting features Schema 'water_areas' does not exist.")</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-wms-gfi.html b/samples/ol3/ol3-wms-gfi.html
@@ -17,8 +17,8 @@
     </head>
     <body>
         <h1>WMS Géoportail "externe" et GetFeatureInfo</h1>
-        <p>couche WMS SHOM chargée avec l'option tiled : true => logos parfois tronqués</p>
-        <p>couche WMS Ecoles chargée sans l'option tiled => logos non tronqués</p>
+        <p>couche WMS SHOM chargée avec l'option tiled : true => logos parfois tronqués, queryable avec le bouton droit (event : "contextmenu").</p>
+        <p>couche WMS Ecoles chargée sans l'option tiled => logos non tronqués, queryable au clic gauche.</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 
@@ -38,6 +38,8 @@ <h1>WMS Géoportail "externe" et GetFeatureInfo</h1>
                         layers : {
                             'WMS1' : {
                                 event: "contextmenu",
+                            },
+                            'ecoles' : {
                             }
                         },
                         options : {

diff --git a/samples/ol3/ol3-wms.html b/samples/ol3/ol3-wms.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte avec une couche WMS</h1>
+        <p>Serveur utilisé : url : "http://services.sandre.eaufrance.fr/geo/zonage", layers : ["TronconHydrographique", "RegionHydro"]</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-wmsc-espagne.html b/samples/ol3/ol3-wmsc-espagne.html
@@ -17,6 +17,7 @@
     </head>
     <body>
         <h1>WMSC Géoportail comme WMS</h1>
+        <p>Ne marche pas : mauvais positionnement du tuilage à priori ("HTTP 400: X,Y values for the tile index were calculated to be {31.516983765983948, 23.381766524120494}  which had to be rounded to {32, 23}  and exceeds the threshold of 10%. Perhaps the client is using the wrong origin ?")</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 

diff --git a/samples/ol3/ol3-wmsc-geologie.html b/samples/ol3/ol3-wmsc-geologie.html
@@ -16,14 +16,15 @@
         <script src="../../dist/ol3/GpOl3-src.js"></script>
     </head>
     <body>
-        <h1>WMSC Géoportail comme WMS</h1>
+        <h1>WMSC Géologie comme WMS</h1>
+        <p>Charge la couche géologie du BRGM depuis le serveur WMSC comme une couche WMS (en mode tuilé)</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
 
             var map = Gp.Map.load('geoportalMap',{
                 apiKey : "jhyvi0fgmnuxvfv0zjzorvdn",
-                proxyUrl : "http://localhost/proxy/php/proxy.php?url=",
-                noProxyDomains : ["wxs.ign.fr"/*,"gpp3-wxs-v-ign-fr.aw.atosorigin.com"*/],
+                // proxyUrl : "http://localhost/proxy/php/proxy.php?url=",
+                // noProxyDomains : ["wxs.ign.fr"/*,"gpp3-wxs-v-ign-fr.aw.atosorigin.com"*/],
                 center : {
                     x : 5.35,
                     y : 45.27,
@@ -36,8 +37,8 @@ <h1>WMSC Géoportail comme WMS</h1>
                 },
                 layersOptions : {
                     "ORTHOIMAGERY.ORTHOPHOTOS" : {},
-                    // Couche WMS-C externe proxyfiée...
                     "GEOLOGY.GEOLOGY::EXTERNAL:OGC:EXTERNALWMS" : {
+                        tiled : true,
                         format : "wms",
                         version : "1.1.1",
                         title : "Géologie (BRGM)",

diff --git a/samples/ol3/ol3-wmsc-luxembourg.html b/samples/ol3/ol3-wmsc-luxembourg.html
diff --git a/samples/ol3/ol3-wmts-geoportail.html b/samples/ol3/ol3-wmts-geoportail.html
@@ -14,6 +14,7 @@
     </head>
     <body>
         <h1>Une carte avec une couche WMTS Géoportail Externe</h1>
+        <p>Ici, tous les paramètres de la couche Photographies aériennes sont passé "à la main" au chargement.</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">
             var map = Gp.Map.load('geoportalMap',{

diff --git a/samples/ol3/ol3-wmts-restful.html b/samples/ol3/ol3-wmts-restful.html
@@ -17,6 +17,7 @@
     </head>
     <body>
         <h1>WMTS Restful</h1>
+        <p>Chargement d'une couche WMTS Restful (Cartes Topographiques du Luxembourg) via Gp.Map.load()</p>
         <div id="geoportalMap"></div>
         <script type="text/javascript">