API d'ArcGis | icgc

API d'ArcGis

Per a utilitzar l'API d'ArcGis són necessaris uns mínims coneixements d'HTML i javascript.

A continuació, es mostra el codi d'un visor d'exemple que utilitza els servidors ICGC en caché per a ArcGis javascript 4.13 en el sistema de referència 3857 i projecció UTM fus 31. Las capes disponibles són topo (mapa topogràfic) i orto (ortofotos).

<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
 <title>Visor bàsic. JS_1.4 API ArcGis</title>
 <style>
   html, body, #viewDiv {
     padding: 0;
     margin: 0;
     height: 100%;
     width: 100%;
   }
 </style>

 <link rel="stylesheet" href="https://js.arcgis.com/4.13/esri/css/main.css">
 <script src="https://js.arcgis.com/4.13/"></script>

 <script>
   require([
     "esri/Map",  
     "esri/Basemap",
     "esri/layers/WMSLayer",
     "esri/widgets/BasemapToggle",
     "esri/views/MapView"
   ], function(Map, Basemap, WMSLayer, BasemapToggle, MapView) {

     var layer_orto = new WMSLayer({
           url: "https://geoserveis.icgc.cat/icc_mapesmultibase/noutm/wms/service",
           spatialReference: 3857,
           sublayers: [
             {
               name: "orto"
             }
           ]
     });    

     var layer_topo = new WMSLayer({
           url: "https://geoserveis.icgc.cat/icc_mapesmultibase/noutm/wms/service",
           spatialReference: 3857,
           sublayers: [
             {
               name: "topo"
             }
           ]
     });

     var ortofoto = new Basemap({
         baseLayers: [layer_orto],
         title: "Ortofoto",
         id: "ortofoto",
         thumbnailUrl: "https://geoserveis.icgc.cat/icc_mapesmultibase/noutm/wms/service?width=100&height=70&bbox=244427,5140358,263584,5153946&format=image%2Fpng&request=GetMap&service=WMS&styles=&transparent=true&version=1.3.0&crs=EPSG%3A3857&layers=orto"
     });


     var map = new Map({
         basemap: {
             baseLayers: [layer_topo],
             title: "topografic",
             id: "topografic",
             thumbnailUrl: "https://geoserveis.icgc.cat/icc_mapesmultibase/noutm/wms/service?width=100&height=70&bbox=244427,5140358,263584,5153946&format=image%2Fpng&request=GetMap&service=WMS&styles=&transparent=true&version=1.3.0&crs=EPSG%3A3857&layers=topo"
         }

     });


     var view = new MapView({
         container: "viewDiv",
         map: map,
         center: [1.82,41.70],
         scale: 50000
     });

     view.when(function () {
           var toggle = new BasemapToggle({
             visibleElements: {
               title: true
             },
             view: view,
             nextBasemap: ortofoto
           });

           view.ui.add(toggle, "top-right");
     });

   });
 </script>
</head>
<body>
 <div id="viewDiv"></div>
</body>
</html>

Exemple ArcGis(2.59 KB)