//图层相关demo
layerFun: function () {
//获取地图的所有图层(不包括的图层类型:底图图层(basemaps))
let layers = this.map.layers;
//获取地图的所有图层(包括所有图层类型)
let alllayers = this.map.allLayers;
//PS:以上的类型都是Collection<Layer>(看起来像java的泛型list),不是js原生的东西,详细用法请看arcgis jsapi官方文档 //传统遍历方法
for (let i = 0; i < layers.length; i++) {
let layer3 = layers.getItemAt(i);
} //Collection支持的通用查询方法,用法类似lambda表达式
//根据条件查询指定图层(只返回一个)
var layer2 = layers.find(function (layer) {
return layer.title === "US Counties";
});
//根据条件查询指定图层(返回多个,类型也是Collection)
var layers4 = layers.filter(function (layer) {
return layer.title === "US Counties";
}); //Collection转js array
let layers5 = layers.toArray(); //根据图层id获取图层
let layer1 = this.map.findLayerById("www");
//根据索引获取图层
let layer = layers.getItemAt(0); //获取图层id
//PS:图层id是图层的唯一标识,string类型。在新建图层时可以指定,如果不指定会生成随机数,以保证唯一
let layerId = layer.id;
//图层范围
let fullExtent = layer.fullExtent;
//图层显示比例尺范围
let maxScale = layer.maxScale;
let minScale = layer.minScale;
//图层显示的透明度,值为0-1,1为不透明
let opacity = layer.opacity;
//图层标题
let title = layer.title;
//图层类型
let type = layer.type;
//图层是否显示,类型bool,同时可设置图层是否显示
let visible = layer.visible; //新建图层并把图层添加到地图
//此处以图形图层(GraphicsLayer)为例
layer = new this.apiInstance.GraphicsLayer({
//空间参考,一般要跟地图的一样
spatialReference: this.mapView.spatialReference,
});
//图层添加到地图
this.map.add(layer);
//添加图层时也可以指定图层索引,默认会把图层添加到最后一位,也就是索引的最大值,图层索引越大越在上面,上面的图层会挡住下面的
//另外在添加图层后也可以改变图层索引,是Map的reorder方法,具体请看官方文档
this.map.add(layer, 0); //从地图删除图层
this.map.remove(layer1);
//从地图删除所有图层
this.map.removeAll(); //地图的图层事件监听
//PS:原则上每个map只监听一次
alllayers.on("change", function (event) {
//添加图层事件
console.log("Layer added: ", event.added);
//删除图层事件
console.log("Layer removed: ", event.removed);
//移动图层(顺序)事件
console.log("Layer moved: ", event.moved);
});
},

arcgis jsapi接口入门系列(2):图层基础操作的更多相关文章

  1. arcgis jsapi接口入门系列(0):总览

    开发环境: arcgis jsapi版本4.9 由于我们这套代码是基于vue,webpack开发的,会有少数vue代码,但总体不影响 里面还有些我们公司的js库和html css,给出的代码不能百分百 ...

  2. arcgis jsapi接口入门系列(5):几何(点线面)基本操作

    点 point: function () { //通过wkt生成点 //wkt,代表点的坐标 let wkt = "POINT(113.566806 22.22445)"; //w ...

  3. arcgis jsapi接口入门系列(3):各种类型的图层添加

    这里说的tomcat切片,是指arcgis server切片后,把切片图片文件用tomcat发布(其他任意web服务器发布都行) //添加tomcat切片图层 addTomcatTileLayer: ...

  4. arcgis jsapi接口入门系列(10):图形高亮

    jsapi也有提供高亮的实现接口,但这里没用,而用的是一种改变图形(graphic)样式的思路 本文实现效果是:地图有多个面图形,当鼠标移动到面的上方,面高亮显示,鼠标移出后高亮解除 初始化 //高亮 ...

  5. arcgis jsapi接口入门系列(4):用代码在地图画点线面

    PS:用代码画点这样写是为了跟后面的用鼠标画点线面区分出来 画点 drawPointGraphic: function () { //点有多种样式:一般的点,显示文字,显示图片 //一般的点 let ...

  6. arcgis jsapi接口入门系列(9):可以同时显示多个的地图popup

    jsapi有提供popup功能,但缺点很多,例如地图上只能同时显示一个popup,popup内容有限制等 本文提供另一个方法,原理不用jsapi,在地图外用一个普通的div放在地图上面,再监听地图的鼠 ...

  7. arcgis jsapi接口入门系列(8):鼠标在地图画面

    初始化,每个map执行一次 PS:画点也差不多,都是用SketchViewModel,因此本demo没有专门写画点的 drawPolygonInit: function () { //画几何对象初始化 ...

  8. arcgis jsapi接口入门系列(7):鼠标在地图画线

    初始化,每个map执行一次就行 drawPolylineInit: function () { //画几何对象初始化 //新建一个图形图层用于存放画图过程中的图形 let layer = new th ...

  9. arcgis jsapi接口入门系列(6):样式

    symbol: function () { //线样式 //样式详情请看官方文档 let style = { //线颜色,支持多种格式: //CSS color string:例如"dodg ...

随机推荐

  1. Windows_Program_Via_C_Translate_Win32编程的背景知识/基础知识_包括基本输入输出机制介绍

    Some Basic Background Story of The Win32 APIs Win32 API背景故事/背景知识 The Win32 application programming i ...

  2. CF 1009 F Dominant Indices —— 长链剖分+指针

    题目:http://codeforces.com/contest/1009/problem/F 也可以用 dsu on tree 的做法,全局记录一个 dep,然后放进堆里,因为字典序要最小,所以再记 ...

  3. Android Studio3.0中dependencies依赖由compile变为implementation的区别

    前言 Android Studio版本更新至3.0了,更新后,连带着com.android.tools.build:gradle 工具也升级到了3.0.0,在3.0.0中使用了最新的Gralde 4. ...

  4. spark学习之IDEA配置spark并wordcount提交集群

    这篇文章包括以下内容 (1)IDEA中scala的安装 (2)hdfs简单的使用,没有写它的部署 (3) 使用scala编写简单的wordcount,输入文件和输出文件使用参数传递 (4)IDEA打包 ...

  5. 极客时间_Vue开发实战_04.开发环境搭建

    Vue CLI的形式搭建环境: vue create hello-world 我们选择default默认的配置,提供babel和eslint的支持.如果你已经对工程化的东西非常了解了.你可以选择自定义 ...

  6. RXJS组件间超越父子关系的相互通信

    RXJS组件间超越父子关系的相互通信 用到这个的需求是这样的: 组件A有数据变化,将变化的数据流通知组件B接收这个数据流并做相应的变化 实例化RXJS的subject对象 import { Injec ...

  7. PTA 4-4 先序输出叶结点 【基础题】

    //二叉树的叶结点:度为0的结点. void PreorderPrintLeaves( BinTree BT ) { if(BT==NULL) //如果传下来根节点就是空,直接返回: return; ...

  8. POJ3414(BFS+[手写队列])

    贴一发自己写的手写队列-.. #include <stdio.h> #include <iostream> #include <string.h> #include ...

  9. Spring Boot 创建自定义的properties文件

    以IDEA2018为例,在资源文件夹上点击鼠标右键,依次选择 New -> Resource Bundle ,如下图: 在弹出的对话框中,填写properties文件的名称(不用填写.prope ...

  10. ES6之Promise对象学习——8个例子学会Promise

    目录 Promise 立即执行 Promise 三种状态 Promise 不可逆性 链式调用 Promise.then()回调异步性 Promise中的异常 Promise.resolve() res ...