现在矢量切片越来越普及,对于地图渲染能更轻更快。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);
});



参考资料:

https://gis.stackexchange.com/questions/300398/is-it-possible-to-add-vector-tile-layer-published-by-geoserver-layer-using-arcgi

ArcGIS JS 4加载第三方矢量切片的更多相关文章

  1. Arcgis for Js之加载wms服务

    概述:本节讲述Arcgis for Js加载ArcgisServer和GeoServer发布的wms服务. 1.定义resourceInfo var resourceInfo = { extent: ...

  2. (转载)arcgis for js - 解决加载天地图和WMTS服务,WMTS服务不显示的问题,以及wmts服务密钥。

    1 arcgis加载天地图和wmts服务 arcgis for js加载天地图的例子网上有很多,这里先不写了,后期有空再贴代码,这里主要分析下WMTS服务为什么不显示,怎么解决. 条件:这里的WMTS ...

  3. 前端设计中关于外部js文件加载的速度优化

    在一般情况下,许多人都是将<script>写在了<head>标签中,而许多浏览器都是使用单一的线程来加载js文件的,从上往下,从左往右. 若是加载过程出错,那么网页就会阻塞,就 ...

  4. 【 js 模块加载 】深入学习模块化加载(node.js 模块源码)

    一.模块规范 说到模块化加载,就不得先说一说模块规范.模块规范是用来约束每个模块,让其必须按照一定的格式编写.AMD,CMD,CommonJS 是目前最常用的三种模块化书写规范.  1.AMD(Asy ...

  5. 【 js 模块加载 】【源码学习】深入学习模块化加载(node.js 模块源码)

    文章提纲: 第一部分:介绍模块规范及之间区别 第二部分:以 node.js 实现模块化规范 源码,深入学习. 一.模块规范 说到模块化加载,就不得先说一说模块规范.模块规范是用来约束每个模块,让其必须 ...

  6. ArcGIS Javascript API 加载高德在线地图扩展

    利用ArcGIS JavaScript API加载高德在线地图的扩展 /** * Created by WanderGIS on 2015/7/15. */ define(["dojo/_b ...

  7. js顺序加载与并行加载

    前端优化过程中常提到js的加载方式,下面说下几种常用的加载方式: 1:head标签内插入<script>标签 <script type="text/javaScript&q ...

  8. js 模版加载到前端

    js 模版加载到前端 简单有效不高端 配个路由 /js/:filename ,  用 readTemplate 响应请求,前端可以按模块方式直接 require 模板 'use strict' var ...

  9. js动态加载以及确定加载完成的代码

    利用原生js动态加载js文件到页面,并在确定加载完成后调用相关function var otherJScipt = document.createElement("script") ...

随机推荐

  1. java struts2 debug

    出了一堆bug 改的顺序和哪个起了作用不太记得了 下面列出遇到问题的顺序:1java.lang.NoSuchMethodException:没这个方法 代码是改正后的,出错的时候保证class ,ac ...

  2. 如何在SQL Server 2008下轻松调试T-SQL语句和存储过程

    一.回顾早期的SQL SERVER版本:早在SQL Server 2000时代,查询分析器的功能还很简陋,远不如VS那么强大.到SQL Server 2005时代,代码高亮.SQL优化等功能逐渐加强, ...

  3. Select2 禁用option

    禁用 $("#priceGroupType option[value='1']").prop('disabled', true); $("#priceGroupType& ...

  4. Caused by: java.util.zip.ZipException: zip file is empty

    1.问题描述:mybranch分支代码和master分支的代码一模一样,mybranch代码部署到服务器上没有任何问题,而master代码部署到服务器上运行不起来. 2.解决办法: (1)登陆服务器启 ...

  5. 09-kubernetes StatefulSet

    目录 StatefulSet 简单测试 使用 StatefulSet 创建基础的PV StatefulSet 清单 StatefulSet 有状态应用副本集 无状态的, 更关注的是群体 有状态的, 更 ...

  6. ftp 客户端 上传

    ps: 1.使用netkit-ftp-0.17交叉编译出来的ftp客户端, 2.然后写上传代码,调用ftp传服务器: 3.最好使用bin二进制文件形式传输: 4.ftp客户端和Ubuntu自带的ftp ...

  7. .NET进阶篇06-async异步、thread多线程4

    知识需要不断积累.总结和沉淀,思考和写作是成长的催化剂 梯子 一.锁1.lock2.Interlocked3.Monitor4.SpinLock5.Mutex6.Semaphore7.Events1. ...

  8. Oracle SCN 详解

    一.简介 scn,system change number 在某个时间点定义数据库已提交版本的时间戳标记,Oracle为每个已提交事务分配一个唯一的scn,scn值是对数据库进行更改的逻辑时间点.sc ...

  9. 三角形列表前缀.html

    发过火刮腹湔肠封官赐爵法规及法规及提供 发过火刮腹湔肠封官赐爵法规及法规及提供 发过火刮腹湔肠封官赐爵法规及法规及提供 发过火刮腹湔肠封官赐爵法规及法规及提供 发过火刮腹湔肠封官赐爵法规及法规及提供 ...

  10. Python一秒搭建ftp服务器,帮助你在局域网共享文件

    "老板 来碗面" "要啥面?" "内牛满面.." 最近项目上的事情弄得人心累,本来是帮着兄弟项目写套入口代码,搞着搞着就被拉着入坑了.搞开发 ...