ArcGIS API for javascript创建二维度地图

1.引用arcgis api for javascript

<link rel="stylesheet" href="https://js.arcgis.com/4.18/esri/themes/light/main.css" />

<link>标签引用main.css包含特定于 Esri 小部件和组件的样式的样式表。

<script src="https://js.arcgis.com/4.18/"></script>

<script>标签从 CDN 加载 ArcGIS API for JavaScript

2.加载模块

<script>

require([ "esri/Map", "esri/views/MapView" ],

    function(Map, MapView) {

// Code to create the map and view will go here

});

</script>

esri/Map - 加载特定于创建地图的代码

esri/views/MapView - 加载允许以 2D 方式查看地图的代码

全局 require() 函数(由 Dojo 提供)用于加载模块。Esri 的 JavaScript API 构建在 Dojo 之上,以利用 Dojo 的模块化代码库及其协调跨浏览器差异的能力。

3.创建地图

esri/Map模块加载的 Map 类的引用,使用basemap将对象传递给 Map 构造函数来指定地图属性,例如

require(["esri/Map", "esri/views/MapView"],

function(Map, MapView) {

var map = new Map({ basemap: "satellite" });

});

4.创建二维视图

在 HTML 文件中查看充当容器的参考节点,允许用户查看 HTML 页面内的地图。通过MapView将对象传递给其构造函数来创建新对象并设置其属性:

require(["esri/Map", "esri/views/MapView"],

function(Map, MapView) {

var map = new Map({

basemap: "topo-vector"

});

var view = new MapView({

container: "viewDiv", // Reference to the DOM node that will contain the view

map: map // References the map object created in step 3

});

});

5.定义页面内容

<body>

<div id="viewDiv"></div>

</body>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值