arcgis api for js实现图层控制

2026-09-01

arcgis api for js入门开发系列七图层控制(含源代码)

上一篇实现了demo的地图分屏对比模块,本篇新增图层控制模块,截图如下(源代码见文章底部): 图层控制模块实现的思路如下: 1.在地图配置文件map.config.js里面配置图层目录树节点信息,作为主界面图层控制的数据源: /*图层目录构造*/ MapConfig.zNodes = [ { id: 1, pId: 0, name: "图层目录", checked: false, iconOpen: "" + getRootPath() + "Conten

arcgis api for js入门开发系列十九图层在线编辑

本篇主要讲述的是利用arcgis api实现图层在线编辑功能模块,效果图如下: 实现思路: 1.arcgis server发布的FeatureServer服务提供的图层在线编辑能力: 2.实现的在线编辑(增删改),主要是通过前端ajax请求后台FeatureServer服务来实现的 (1)http://120.199.78.138:6080/arcgis/rest/services/dlsde/FeatureServer/0/updateFeatures public void ProcessR

arcgis api for js入门开发系列四地图查询(含源代码)

备注:由于实现本篇功能的需求,修改了地图数据的dlsearch.mxd,然后更新了地图服务,需要的在文章最后有提供最新的mxd以及源代码下载的上一篇实现了demo的地图工具栏,本篇新增地图查询功能,包括属性查询和空间查询两大块,截图如下: 属性查询效果图: 空间查询效果图: 谈核心代码实现之前,我大概的讲一讲arcgis for js的地图查询方式,一般来说,总共有三种查询方式:FindTask.IdentifyTask.QueryTask (1)FindTask查询模式:基于关键字来模糊查询

arcgis for javascript之ArcGISDynamicMapServiceLayer图层控制的实现

图层控制是非常多GIS系统里面必须的一个小功能,本文就说说arcgis for javascript下ArcGISDynamicMapServiceLayer图层控制的实现方式.首先看图: 实现效果重点有下面两点:1.获取ArcGISDynamicMapServiceLayer的图层:2.控制图层的显示. 图层的获取可通过layerInfos实现,图层的显示通过setVisibleLayers实现,源码例如以下: <!DOCTYPE html> <html> <head&g

转：arcgis api for js入门开发系列四地图查询

原文地址:arcgis api for js入门开发系列四地图查询 arcgis for js的地图查询方式,一般来说,总共有三种查询方式:FindTask.IdentifyTask.QueryTask (1)FindTask查询模式:基于关键字来模糊查询地图图层,属于文本型的,不能基于地图的设置的空间范围Geometry来查询,但是可以跨越多个图层来查询,比如餐饮图层.医疗服务图层等等: (2)IdentifyTask查询模式:跟FindTask反过来,基于地图的设置的空间范围Geometry

arcgis api for js 地图查询

arcgis api for js入门开发系列四地图查询(含源代码) 上一篇实现了demo的地图工具栏,本篇新增地图查询功能,包括属性查询和空间查询两大块,截图如下: 属性查询效果图: 空间查询效果图: 谈核心代码实现之前,我大概的讲一讲arcgis for js的地图查询方式,一般来说,总共有三种查询方式:FindTask.IdentifyTask.QueryTask (1)FindTask查询模式:基于关键字来模糊查询地图图层,属于文本型的,不能基于地图的设置的空间范围Geometry来

arcgis api for js入门开发系列一arcgis api离线部署

在我的GIS之家QQ群里,很多都是arcgis api for js开发的新手,他们一般都是GIS专业的学生,或者从计算机专业刚刚转向来的giser,他们难免会遇到各种webgis开发的简单问题,由于白天工作忙碌的原因,没有来得及回答他们的提出的问题,所以利用空余时间来写一系列简单的入门arcgis api for js开发教程,仅供初学者giser学习使用,其中写的不足之处,欢迎批评指正,大家一起交流学习. arcgis for js开发依赖arcgis地图服务的,而arcgis地图服务的发布

arcgis api for js入门开发系列十一地图统计图

上一篇实现了demo的叠加SHP图层,本篇新增地图统计图,截图如下: 地图统计图实现的思路如下:利用拓展arcgis api的js文件(MapChartGraphic.js以及MapChartGraphic.js),然后构造统计的数据源,直接调用即可: 1.map.html页面引用地图统计图需要的js文件 dojoConfig = { parseOnLoad: true, packages: [ { name: 'MapChart', location: this.location.pathna

arcgis api for js入门开发系列二十打印地图的那些事

前面我写过关于利用arcgis api for js打印地图的,但是打印地图服务都是基于arcgis server发布的,arcgis api加载在线地图,比如天地图.百度地图.高德地图等,底图都是打印不出来的:这个在GIS之家群里也有很多giser问过,我一直也没抽出时间好好整理研究,碰巧一个师妹遇到这种打印问题并且解决了,于是我向她邀稿,才有这里的这篇文章.本文是‘猴妹‘师妹授权给我来发表的,介绍都是师妹的研究成果,在此,非常感谢‘猴妹‘师妹. 记录了通过ArcGIS的PringTask进行

Arcgis API for JS——打印控件乱码

在通过Arcgis API for JS编写打印控件进行地图下载时,总发现地图字体乱码,如下图: 解决方法: 在装有ArcGIS Server,要调用服务的电脑或服务器上找到下图文件夹

ArcGIS API for js Legend（图例）

1.说明有关怎么把ArcGIS API for js部署到IIS上,请参考我上面的写的博客https://www.cnblogs.com/net064/p/10302660.html 2.运行效果 3.html代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <

arcgis api for js 4.X 出现跨域问题

arcgis api for js 4.X 出现跨域问题 XMLHttpRequest cannot load http://localhost/4.3/4.3/esri/workers/mutableWorker.js. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:65523' is therefore not allowed acc

arcgis api for js 出现跨域问题

最近几天在开始入手 arcgis api for js .那就先写些Demo练练手. 选择百度地图.这里用的是拼地图 url 的方式来加载百度地图. 加载百度地图参考的是:ArcGIS API for JavaScript 加载百度地图. 这里用的是arcgis api 3.20 的(我加载的是在线的).现在最新的是4.11,前面用4.10的加载偏移太大就找这个看看. 先在这个基础上看看,没有问题再用4.11的. 问题上面基本情况介绍了,拿过来一直出不来地图. 通过调试发现是跨域的问题: Ac

在IIS服务器上本地部署 ArcGIS API for js 4.15

作为一名刚入门的小白,还没开始一个helloworld就在软件安装,环境部署时遇到了一大堆问题,简直太让人头秃了,脑壳疼.话不多说,这篇主要想分享一下自己部署ArcGIS API for js 4.15的过程. 一.ArcGIS API for js 4.15下载网站链接:https://developers.arcgis.com/downloads/ 有账号的直接登录,没有账号的需要注册一下,只能注册ArcGIS Online试用账号,Esri开发者账号中国区暂不支持注册. 登录进去以后点击

arcgis api for js入门开发系列十叠加SHP图层

上一篇实现了demo的热力图,本篇新增叠加SHP图层,截图如下: 叠加SHP图层效果实现的思路如下:利用封装的js文件,直接读取shp图层,然后转换geojson,最后通过arcgis api来解析转换graphic绘制叠加在地图展示 1.map.html页面引用叠加SHP需要的js文件  <script src="stream.js"></script> <script src="shape

arcgis api for js入门开发系列六地图分屏对比(含源代码)

上一篇实现了demo的地图标绘模块,本篇新增地图地图分屏对比模块,截图如下(源代码见文章底部): 对效果图的简单介绍一下,在demo只采用了两分屏对比,感兴趣的话,可以在两分屏的基础上拓展,修改css样式以及js控制,可以修改为多屏对比效果: 1对应的是鼠标当前位置,2对应的是1在另一个分屏的地图位置:3是切图不同底图的作用. 地图分屏效果的对比,核心在于拥有不同年份或者不同类型的底图之间的对比才有意义的,这里的dmeo由于地图数据素材的限制,没有不同类型的底图,所以凑合的采用同一张底图的对比,

arcgis api for js入门开发系列二不同地图服务展示(含源代码)

上一篇介绍了arcgis api离线部署,这篇开始正式介绍arcgis api for js开发:想要学习webgis开发,首先得熟悉了解前端技术,比如界面布局设计的html+css,核心的是javascript(js),arcgis api就是js写的,就是说想要开发gis功能前提下,你得熟悉了解js,不然你连源代码都看不懂.在这里,推荐esri官网的arcgis api for js:https://developers.arcgis.com/javascript/3/jsapi/:里面详细

arcgis api for js实现克里金插值渲染图--不依赖GP服务

本篇的亮点是利用kriging.js结合arcgis api for js,实现克里金插值渲染图,截图如下: 具体实现的思路如下: 1.kriging.js开源js,可以实现针对容器canvas克里金插值效果,但是没有结合地图一起的,不能随着地图拖动缩放的,需要跟地图绑定在一起才行的,这里先实现canvas渲染插值效果,kriging.js的plot函数可以达到这样的目的: kriging.plot(canvas, grid, [113.220276, 113.476929], [29.7379

arcgis api for js入门开发系列十五台风轨迹

上一篇实现了demo的地图最近设施点路径分析,本篇新增台风轨迹,截图如下: 下面简单介绍相关知识点: 警戒线警戒线坐标集合: var lineArr24=[[127,34],[127,21],[110,15]];//24小时警戒线坐标集合 var lineArr48=[[132,34],[132,15],[105,0]];//48小时警戒线集合线符号样式SimpleLineSymbol: var symbol24 = new esri.symbol.SimpleLineSymbol(esri

ArcGIS API for JS 测量线长（各折线段）

这里测量长度主要分为两个方面,一个是在绘制长折线段时,不仅需要显示总线段的长度,还要在各线段的中间显示各折线段的长度:另一个则是在绘制多边形时,不仅需要显示多边形的面积,还需要在各边的中间显示线段长.前提:在每次绘制图形的时候,都要消除图层上已有的图形,那么则需要clear()图层.此处的clear()为地图的图像清除.如下: this.map.graphics.clear();// 清除了地图的图像,使其无法访问到GraphicsLayer this._refreshGraph

arcgis api for js实现图层控制

热门专题