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

最新推荐文章于 2024-07-08 16:55:35 发布

学学GIS

最新推荐文章于 2024-07-08 16:55:35 发布

阅读量700

点赞数

分类专栏： ArcGIS JS API

本文链接：https://blog.csdn.net/baidu_28157641/article/details/108382325

版权

ArcGIS JS API 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

一、发布要素类为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中设置共享给所有人。

学学GIS

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ArcGIS API for JavaScript学习笔记（4）加载Online上的要素图层

一、发布要素类为Web图层从ArcGIS Pro中共享要素类为Web图层，如数据不涉密，此处可以勾选共享给所有人。共享成功后在ArcGIS Online上的要素图层页面复制URL链接备用二、编写代码<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,
复制链接

扫一扫

专栏目录