ArcGIS API for JavaScript学习笔记(4)加载Online上的要素图层

tech2023-02-18  110

一、发布要素类为Web图层

从ArcGIS Pro中共享要素类为Web图层,如数据不涉密,此处可以勾选共享给所有人。

共享成功后在ArcGIS Online上的要素图层页面复制URL链接备用

二、编写代码

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>加载Online上的图层</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css" /> <script src="https://js.arcgis.com/4.16/"></script> <script> require(["esri/Map", "esri/views/MapView","esri/layers/WebTileLayer","esri/layers/FeatureLayer"], function(Map, MapView,WebTileLayer,FeatureLayer) { var tiledLayer = new WebTileLayer({ urlTemplate: "http://mt0.google.cn/vt/lyrs=s&x={col}&y={row}&z={level}" }); var tiledLayer_poi = new WebTileLayer({ urlTemplate: "http://{subDomain}.tianditu.gov.cn/DataServer?T=cva_w&x={col}&y={row}&l={level}&tk=5823959c38b2d69b25e84a7482d27e10", subDomains: ["t0", "t1", "t2", "t3","t4", "t5", "t6", "t7"], }); var map = new Map({ basemap: { baseLayers: [tiledLayer, tiledLayer_poi] } }); var view = new MapView({ container: "viewDiv", map: map, zoom: 13, center: [117.70,28.31] // longitude, latitude }); // 从VS code中运行时,在网页上弹出的对话框中填写ArcGIS Online账号密码之后不能登陆,可将代码粘贴至CodePen运行 var xzxzqLayer = new FeatureLayer({ url: "https://services5.arcgis.com/6TqOiOhyqcUv6dB0/arcgis/rest/services/铅山县乡镇/FeatureServer/0" }); map.add(xzxzqLayer, 0); }); </script> </head> <body> <div id="viewDiv"></div> </body> </html>

注:如果第一步共享为web图层时没有勾选共享给所有人,在浏览器中运行html时会弹出登录Online的对话框,但是即使输入账号密码仍然不能正常登录,这时可以将代码复制到CodenPen中运行,输入账号密码之后可以正常登录Online以访问私有的要素图层。为求简化操作,在不涉密的情况下可以直接勾选共享给所有人,或者在Online中设置共享给所有人。

最新回复(0)