esri默认底图的加载

以satellite为例

方式一：

var map = new Map({

basemap:”satellite”

});

方式二：

 var EsriSatelliteWebtilelayer = new WebTileLayer({
      urlTemplate:”https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{level}/{row}/{col}”
     });

方式三：

 var EsriImglayer = new WMTSLayer({
      url:”http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/WMTS”,
      serviceMode:”RESTful”
     });

方式四：

     var EsriSatelliteTileLayer = new TileLayer({
      //attributionDataUrl:”https://static.arcgis.com/attribution/World_Imagery”,
      url:”https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer”
     });

方式一：

依次请求

https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer?f=json

https://static.arcgis.com/attribution/World_Imagery?f=json

//

https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tilemap/1/0/0/32/32

https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/1/0/1

//

https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tilemap/2/0/0/32/32

https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/2/2/2

方式二：

直接请求切片：https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/1/1/1

方式三：

依次请求

元数据：https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/WMTS/1.0.0/WMTSCapabilities.xml

切片：https://services.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/WMTS/tile/1.0.0/World_Imagery/default/default028mm/1/1/1.jpg

方式四：

是方式一的实际实现方式

二、比较特殊的非srcgisserver服务：

1、osm（openstreetmap),默认第一种加载方式为直接加载图片

所以，需要利用WebTileLayer进行加载（注意col和row的顺序，注意调整）

     var EsriOsmlayer =new WebTileLayer({
      urlTemplate:”https://b.tile.openstreetmap.org/{level}/{col}/{row}.png”
     });

2、vector tile矢量切片服务

  //以dark-gray-vector为例
     var EsriDarkgrayvectorlayer =new VectorTileLayer({
      url:”https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer”
     });

依次发送请求

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer?f=json

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/resources/styles/root.json

https://static.arcgis.com/attribution/Vector/v1/World_Basemap?f=json

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/resources/sprites/sprite.json

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/resources/sprites/sprite.png

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/tilemap

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/tile/0/0/0.pbf

https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/resources/fonts/Arial%20Regular/0-255.pbf

不同的style渲染

 //gray-vector
     var EsriGrayvectorlayer =new VectorTileLayer({
      url:”https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer”
     });
     EsriGrayvectorlayer.loadStyle(“https://www.arcgis.com/sharing/rest/content/items/5dd75c1a544b46c3af01ba5736bfdfa0/resources/styles/root.json”);

完整加载代码如下：



 
 
  WMSLayer – 4.5