ArcGIS API For JavaScript - 地图常用函数方法

常用函数方法

一. 地图放缩小按钮
二. 底图样式
三. 创建加载ArcGISDynamicMapServiceLayer图层、FeatureLayer图层
四. 跳转地图中心点至指定坐标位置
五. 缩放地图至指定等级
六. 清空加载至地图的要素类
七. 加载、清除指定图层
八. 创建及使用客户端图层（GraphicsLayer）
九. Demo实例

一. 地图放缩小按钮

二. 底图样式

更多底图请进入arcgis api for javascrilpt官网查看：https://developers.arcgis.com/javascript/latest/api-reference/esri-Map.html#

三. 创建加载ArcGISDynamicMapServiceLayer图层、FeatureLayer图层

四. 跳转地图中心点至指定坐标位置

map.centerAt([118.675403, 32.067296])

五. 缩放地图至指定等级

map.setZoom(18)

六. 清空加载至地图的要素类

map.graphics.clear();

七. 加载、清除指定图层

//清除serverLayer图层
map.removeLayer(serverLayer);
//加载stationLayer图层
map.addLayer(stationLayer);

八. 创建及使用客户端图层（GraphicsLayer）

//创建客户端图层
var graphicsLayer = new esri.layers.GraphicsLayer();
//将客户端图层添加到地图中
map.addLayer(graphicsLayer);
//将点要素放入客户端图层
graphicsLayer.add(marker);
//清空graphicsLayer图层
graphicsLayer.clear();

九. Demo实例

@{Layout = null;
}<!DOCTYPE html><html>
<head><meta name="viewport" content="width=device-width" /><title>Index</title>@*加载高德地图*@<script type="text/javascript">var dojoConfig = {async: true,parseOnLoad: true,packages: [{name: "js",location: location.pathname.replace(/\/[^/]*$/, '') + '/js'}]};</script><script src="~/Scripts/jquery-3.3.1.js"></script><link href="~/Content/esri.css" rel="stylesheet" /><link href="~/Content/tundra.css" rel="stylesheet" /><script src="~/Scripts/init.js"></script><style>* {margin: 0;padding: 0;}#map {width: 100%;height: 100%;position: absolute}.list {width: 12%;background-color: rgba(22, 59, 90, 0.8);color: #fff;position: absolute;}input, select, button {width: 90%;margin: 10px 5%;border-radius: 5px;height: 26px;}</style><script>var urlMap = 'http://xxx:6080/arcgis/rest/services/njcs/MapServer'var stationUrl = 'http://xxx:6080/arcgis/rest/services/njcs/MapServer/0'var lineUrl = 'http://xxx:6080/arcgis/rest/services/njcs/MapServer/1'var map;var serverLayer;//总图层var stationLayer;//站点图层var lineLayer;//线路图层require(["esri/map", "js/gaodeLayer", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/FeatureLayer", "esri/geometry/Circle", "esri/layers/GraphicsLayer","dojo/domReady!"],function (Map, gaodeLayer, ArcGISDynamicMapServiceLayer, FeatureLayer, Circle,GraphicsLayer,) {/* code goes here */map = new Map("map", {center: [118.724, 32.186],zoom: 12,logo: false,slider: false,//放大、缩小按钮//basemap:"streets-vector",//设置底图样式});//创建ArcGISDynamicMapServiceLayer图层（opacity：图层透明度）serverLayer = new ArcGISDynamicMapServiceLayer(urlMap, { "opacity": 0.6 });//创建FeatureLayer图层，ArcGISDynamicMapServiceLayer子图层stationLayer = new FeatureLayer(stationUrl, { "opacity": 0.6 });lineLayer = new FeatureLayer(lineUrl, { "opacity": 0.6 });var baselayer = new gaodeLayer();//默认加载矢量 new gaodeLayer({layertype:"road"});也可以    //加载高德地图map.addLayer(baselayer);//添加高德地图到map容器//加载ArcGISDynamicMapServiceLayer图层或FeatureLayer图层至地图map.addLayer(serverLayer);});function center() {map.centerAt([118.675403, 32.067296])}function zoom() {map.setZoom(18)}function clear() {map.graphics.clear()}function clearLayer() {map.removeLayer(serverLayer);}function addLayer() {map.addLayer(stationLayer);}</script>
</head>
<body><div id="map"></div><div class="list"><button onclick="center()">跳转中心点</button><button onclick="zoom()">缩放地图</button><button onclick="clear()">清空图层</button><button onclick="clearLayer()">清除指定图层</button><button onclick="addLayer()">加载指定图层</button></div>
</body>
</html>

ArcGIS API For JavaScript - 地图常用函数方法相关推荐

在移动设备中创建ArcGIS API for JavaScript地图应用程序
本教程将演示如何通过响应式移动专用布局窗口小部件创建移动友好的webapp 1.支持的设备这个模板支持安卓和IOS横向和纵向姿态,它使用Dojo Mobile框架并包含Dojo标题窗口等小部件. 2 ...
ArcGIS API for JavaScript——地图展示
ArcGIS API for JavaScript 能够实现的最基本功能就是地图展示,包括地图缩放.平移.定位.实时显示坐标.展示地图要素(指北针.比例尺.图例).切换地图等.本文将详细介绍地图展示的 ...
地图小部件—ArcGIS API for JavaScript
电子地图和传统的纸质地图最大的区别就是交互的程度不一样,而交互性很大程度上由地图的小部件所控制.传统的纸制地图主要有三个基本的部件(要素):比例尺.指北针.图例,而电子地图有更多的交互性小部件选择,在 ...
ArcGIS API For JavaScript学习笔记
之前学习ArcGIS API For JavaScript的一些记录,有些是转载的,不过转载的自己有重新做过一遍,这里做个总结,方便后面来学习回顾. 1.ArcGIS API For JavaScri ...
ArcGIS API for javascript创建二维度地图
1.引用arcgis api for javascript <link rel="stylesheet" href="https://js.arcgis.com/4 ...
基于ArcGIS API for JavaScript加载百度各种类型切片地图
文章目录应用场景需求分析效果图实现代码原理解读应用场景部分项目基于ArcGIS平台,但是甲方只提供部分矢量数据,用作底图的地形图数据没有,表示可以使用百度地图作为底图.所以才会有使用Ar ...
ArcGIS API for JavaScript根据两个点坐标在地图上画线
ArcGIS API for JavaScript根据两个点坐标在地图上画线比如说a(xxxx,xxxxx),b(xxxx,xxxxx).利用这两个点画一条线 var polyline = new ...
ArcGIS API for JavaScript创建 3D 地图
1.引用ArcGIS API for JavaScript <link rel="stylesheet" href="https://js.arcgis.com/4 ...
ArcGIS API for JavaScript 4.4 版本加载谷歌地图
ArcGIS API for JavaScript 4.X 版本升级后,API发生了很大的变化. 其中就支持了WebEarth展示,主要是通过 esri/views/SceneView 实现的. 在新 ...
ArcGis API for JavaScript学习——加载地图
ArcGis API for JavaScript开发笔记--加载地图在这个例子中使用的离线部署的API(请参见 http://note.youdao.com/noteshare?id=f42865 ...

ArcGIS API For JavaScript - 地图常用函数方法

常用函数方法

一. 地图放缩小按钮

二. 底图样式

三. 创建加载ArcGISDynamicMapServiceLayer图层、FeatureLayer图层

四. 跳转地图中心点至指定坐标位置

五. 缩放地图至指定等级

六. 清空加载至地图的要素类

七. 加载、清除指定图层

八. 创建及使用客户端图层（GraphicsLayer）

九. Demo实例

ArcGIS API For JavaScript - 地图常用函数方法相关推荐

最新文章

热门文章