欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ArcGIS JS 4加载第三方矢量切片

程序员文章站 2023-09-07 08:47:48
现在矢量切片越来越普及,对于地图渲染能更轻更快。ArcGIS JS 4.13可以实现加载第三方矢量切片,以下为代码示例,最下方是我之前切的建筑物数据。 当切片大小在1M左右,加载效果还是可以。不过跟mapbox gl相比还是有些逊色,mapbox gl可以加载6M大小的切片,但ArcGIS JS 4 ......

    现在矢量切片越来越普及,对于地图渲染能更轻更快。arcgis js 4.13可以实现加载第三方矢量切片,以下为代码示例,最下方是我之前切的建筑物数据。

    当切片大小在1m左右,加载效果还是可以。不过跟mapbox gl相比还是有些逊色,mapbox gl可以加载6m大小的切片,但arcgis js 4却不行。矢量切片还是需要控制好大小,这样才能快速传输和渲染。

var style = {
  "version": 8,
  "sources": {
   "osm": {
     "tiles": ["https://osm-lambda.tegola.io/v1/maps/osm/{z}/{x}/{y}.pbf"],
      "type": "vector"
    }
  },
  "layers": [
   {
     id: "land",
      type: "fill",
      source: "osm",
      "source-layer": "land",
      minzoom: 0,
      maxzoom: 24,
      paint: {
       "fill-color": "rgba(150, 150, 150, 1)"
     }
   }
  ],
  "id": "test"
}

require([
 "esri/map",
 "esri/views/mapview",
 "esri/layers/vectortilelayer",
 "dojo/domready!"
], function(map, mapview, vectortilelayer) {
 var map = new map();
  var view = new mapview({
   container: "map",
    map: map,
    center: [-98.5795, 39.8283],
   zoom: 2,
 });
  var tilelyr = new vectortilelayer({
   style: style
  });
  map.add(tilelyr);
});

ArcGIS JS 4加载第三方矢量切片

ArcGIS JS 4加载第三方矢量切片
参考资料: