关于arcgis:使用ArcGIS-API生命周期钩子实现某个图层保持置顶

前言ArcGIS API如同国内用的不多,除了设计院以外,大多数还是用的百度和高德API。ArcGIS API的文档是全英文,因而分享一些小性能的实现思路。 需要ArcGIS中,新增加的图层永远在最下面,就像这样: 而在业务逻辑上,有时咱们须要某个图层置顶。比方用来统计面积大小的图层,如果它被其余图层笼罩掉,就不能失常的统计面积和显示被选中的地块了: 本文就来解决这个问题 先说原理,非常简单,应用到生命周期钩子函数。 尝试的其余办法首先尝试了add图层是能不能手动设置order,也就是给它设置的地位很高,比方100: 为了便于交换,咱们临时把这个图层叫做areaSumLayer。 // 业务上须要置顶的图层let areaSumLayer: GraphicsLayer// 增加图层时设置的很高map.add(areaSumLayer,100);事实上这样不行,因为后面提到它的逻辑是:“新增加的图层永远在最下面”即便以前的图层设置的很高,新图层还会更高,比方地位在101。 因而咱们的思路是:无奈在创立areaSumLayer时保障它当前是置顶的而是在创立其余图层时保护一下areaSumLayer的地位 生命周期钩子什么是生命周期?所有的前端组件都应用了这个思维。生命周期指的是从一个组件从创立到沦亡的过程。 拿前端框架Angular举例,最常见的包含: ngOnInit(): 组件创立ngOnChanges(): 绑定的数据发生变化时ngOnDestoryed(): 组件销毁https://angular.cn/guide/lifecycle-hooks 或者VUE中: created(): 组件创立mounted(): 组件渲染结束beforeUpdate():产生变更前updated(): 产生变更unmounted(): 组件登记https://cn.vuejs.org/guide/essentials/lifecycle.html这些生命周期钩子是在框架开发者编写时就写好的,要应用这些周期函数,只须要用回调的形式,传入一个咱们本人写好的办法,这个办法会在适当的机会(生命周期产生时)被主动调用,用到的就是订阅者-观察者模式。 ArcGIS API接下来看看ArcGIS的图层有什么生命周期(官网称之为事件event): https://developers.arcgis.com/javascript/latest/api-reference...before-add:增加前after-add:增加后before-changes:变更前change:变更after-changes:变更后before-remove:销毁前after-remove:销毁后有这么多生命周期,而咱们的业务上用到的是增加后,也就是“当新图层增加后,咱们手动的更新一下须要置顶的areaSumLayer图层。 after-add是这样用的: https://developers.arcgis.com/javascript/latest/api-reference...map.layers.on("after-add", function(event){ console.log(event.item.id);});map.layers.on是开启监听,map就是Map类创立的对象"after-add"是监听的事件类型,咱们须要监听增加图层之后的事件event是本人写的回调函数中的变量办法体是咱们要在回调时执行的操作失常状况下,当有新的图层被增加进来时,控制台就会输入它的ID。 接下来是寻找:areaSumLayer有没有曾经被增加须要用到collection汇合的find办法: https://developers.arcgis.com/javascript/latest/api-reference... find办法是寻找某个图层在不在图层汇合中,应用的还是回调函数: // 如果此时图层汇合中有面积的图层 if (map.layers.find(function (layer) { return layer.id === areaSumLayer.id })){ console.log("true"); }逐条解释: 咱们定义了一个办法: function (layer) { return layer.id === areaSumLayer.id}layer是回调时的变量,能够轻易写,但要和办法体中对应办法的内容就是:判断回调变量的图层id和咱们的id是否相等,如果相等,阐明咱们要查问的图层在这个汇合中,返回true接下来解决“调整图层程序”的步骤: // 从新增加面积图层map.remove(areaSumLayer);map.add(areaSumLayer);就是先暗藏再从新增加因而合起来就变成了这样: /** * 地图生命周期 * 当图层创立后,把预览图片的图层从新增加一下,使其永远置顶 */ map.layers.on('after-add', (event) => { // 如果此时图层汇合中有areaSumLayer图层 if (map.layers.find(function (layer) { return layer.id === areaSumLayer.id })) { // 从新增加areaSumLayer图层 map.remove(areaSumLayer); map.add(areaSumLayer); } })此时,只有有别的图层增加结束,钩子函数就会从新把areaSumLayer置顶。 ...

May 6, 2023 · 1 min · jiezi

关于arcgis:译ArcGIS-JS-API-4x-历史版本及关键更新

译:ArcGIS JS API 4.x 历史版本及要害更新4.0 公布工夫: 2016-05这是 4.x 系列 API 的第一个正式版本。因为之前的 4.x 版本处于测试阶段,因而此处不思考记录它们。 4.1 公布工夫: 2016-09WebMap.version 属性重命名为 WebMap.sourceVersion。WebScene.version 属性重命名为 WebScene.sourceVersion。ClosestFacilityParameters.returnPolygonBarriers 属性重命名为 ClosestFacilityParameters.returnPolygonBarriers。FeatureLayer.createQueryParameters 属性重命名为 FeatureLayer.createQuery。Popup 的 dockOptions.position 属性值当初除了承受字符串之外,也承受函数。NavigationToggle 已被增加到 SceneView 的 default.widgets (默认组件) 之中。The Geoprocessor.getResultImageLayer() 办法被 Geoprocessor.getResultMapImageLayer() 代替。对于签名的变更,请查看SDK 文档。GroupLayer、Map 和他们的子类中的layer-add、layer-remove和 layer-reorder事件已被移除,取而代之的是 esri/core/Collection的 change 事件。4.2 公布工夫: 2016-12VectorTileLayer 的ACCESS_TOKEN属性已被移除。为了进步安全性,浏览器开始在不平安的页面上阻止 Geolocation API,这意味着定位按钮将无奈在不平安的网页(即 http 协定的链接)上应用。 谷歌浏览器首先在版本 50(2016 年 4 月)中实现了这个性能。苹果也打算在 Safari 10(2016 年 9 月)中实现了这一点。 Mozilla/Firefox 正打算做同样的事件。 在 4.0 和 3.17 版本中,JSAPI 不再在 Chrome 浏览器中显示非平安 Web 应用程序的定位按钮。 从版本 4.2 和 3.19 开始,JSAPI 不再在浏览器上任何不平安的网页程序中显示定位按钮。 请留神,localhost 被认为是“潜在平安的”,可用于便捷测试。4.3 公布工夫: 2017-03sizeRendererCreator.createVisualVariable()重命名为 sizeRendererCreator.createVisualVariables() ,因为它的返回值类型改成数组了。4.4 公布工夫: 2017-07从 4.4 版开始,locator.locationToAddress() 办法返回一个正确的 AddressCandidate。 此谬误修复会影响五个 AddressCandidate 属性中的两个:address 和 attributes。 请留神,其余 AddressCandidate 属性(extent、location 和 score) 没有变动。 ...

March 4, 2023 · 6 min · jiezi

关于arcgis:入门cesium之数据处理arcmap极地坐标投影系转84坐标投影并idesktop修改样式生成图片

题外话(能够跳过间接看上面操作):哎。。。。。。。。。。。。。为啥让我解决数据啊,我连arcmap、idesktop咋用都不晓得。只能一点点问共事,我重大狐疑我老大是不是错认为我会解决数据。1.加载高程tif数据,左侧有layer列表能够看到。2.关上转换工具箱,ArctoolboxData Management Tools >> Projections and Transformations >> Raster >> project Raster3.转换投影1标抉择原始tif,3标输出84坐标再确定就ok了。4.idsktop导入数据集,这里我抉择导入栅格模式,因为前面我要改款式。5.关上数据集,而后左下角图层管理器中导入已有的专题图模板。6.把非凡值通明掉,而后暗藏原图层,最初右键地图抉择地图输入为图片,这里抉择范畴是寰球范畴。7.最初生成的图片就能够拿去做贴图了。不是天文相干业余毕业的,有不正确的中央请见谅。

November 5, 2021 · 1 min · jiezi

关于arcgis:arcgis-for-js绘制面

作者这里用的esri版本是419这里须要提前初始化draw包"esri/views/draw/Draw" this.$message.success("开始绘制");var draw = new Draw({view:this.view})var action = draw.create("polygon", { mode: "click"//点击形式加点});// 获取焦点this.view.focus();// 顶点增加事件action.on("vertex-add", (evt) =>{this.createPolygon(evt)});//顶点移除事件action.on("vertex-remove", (evt) =>{this.createPolygon(evt)});// 鼠标挪动事件action.on("cursor-update", (evt) =>{this.createPolygon(evt)});// 绘制实现事件action.on("draw-complete", (evt) =>{this.createPolygon(evt)this.$message.success("完结绘制");});这里用到了graphic和polygon两个包 "esri/Graphic""esri/geometry/Polygon"async createPolygon(event) { //获取所有顶点 var vertices = event.vertices; //革除之前绘制 this.view.graphics.removeAll(); var Graphic = await arcgisPackage.Graphic; var Polygon = await arcgisPackage.Polygon; // 生成绘制的图形 var graphic = new Graphic({ geometry: new Polygon({ hasZ: false, hasM: false, rings: [vertices], spatialReference: this.view.spatialReference }), symbol: { type: "simple-fill", // autocasts as new SimpleFillSymbol() color: [ 51,51, 204, 0.9 ], style: "solid", outline: { // autocasts as new SimpleLineSymbol() color: "white", width: 1 } } }); this.view.graphics.add(graphic); console.log(graphic.geometry.toJSON());}更多文章原作者链接 ...

June 21, 2021 · 1 min · jiezi

关于arcgis:arcgis-for-js基础缩放和定位功能

援用了两个包'esri/widgets/Zoom' var zoom = new Zoom({ view: this.view});zoom.zoomOut(); var zoom = new Zoom({ view: this.view});zoom.zoomIn(); 视角定位"esri/geometry/Point" let pt = new Point(点位);this.view.goTo(pt)

June 4, 2021 · 1 min · jiezi

关于arcgis:arcgis加载wtms数据

这是wtms服务地址,肯定要记得加tile http://***.***.***.***:6080/arcgis/rest/services/***/***/MapServer/tile/export const CustomWMTS = async (val) => { let BaseTileLayer = await arcgisPackage.BaseTileLayer; let Request = await arcgisPackage.Request; let TDT = await BaseTileLayer.createSubclass({ properties: { urlTemplate: null, layerType:'wmts' }, getTileUrl: function (level, row, col) { let url =val + level + '/' + row + '/' + col return url; }, fetchTile: function (level, row, col) { let url = this.getTileUrl(level, row, col); return Request(url, { responseType: "image", }).then((response) =>{ let image = response.data; let width = this.tileInfo.size[0]; let height = this.tileInfo.size[0]; let canvas = document.createElement("canvas"); let context = canvas.getContext("2d"); canvas.width = width; canvas.height = height; context.drawImage(image, 0, 0, width, height); return canvas; }) }, }); let layer = await new TDT(); return layer}

June 4, 2021 · 1 min · jiezi

关于arcgis:arcgis-for-js动态空间featureLayer着色渲染-renderer设置

arcgis for js 等级着色 1.依据公布的数据设置多种symbol款式 let less35 = { type: "simple-fill", // autocasts as new SimpleFillSymbol() color: "#38627a", style: "solid", outline: { width: 0.2, color: [255, 255, 255, 0.5] }}let less36 = { type: "simple-fill", // autocasts as new SimpleFillSymbol() color: "#FF66CC", style: "solid", outline: { width: 0.2, color: 'red' }}2.创立一个renderer,设置要害id(就是依据哪个字段进行分等级,我这里抉择的是OBJECTID_1),接入之前创立款式并且依据值分等级 let render2 = { type:'class-breaks', field: "OBJECTID_1", classBreakInfos: [ { minValue: 0, maxValue: 1000, symbol: less35, label: "< 35%" // label for symbol in legend }, { minValue: 1000, maxValue: 2000000.3499, symbol: less36, label: "< 35%" // label for symbol in legend } ]}3.于featureLayer中应用,不晓得的能够看我另外的文章 ...

May 28, 2021 · 1 min · jiezi

关于arcgis:arcgis-for-js-缓冲分析

this.view.on('click', (evt) => { let layer = this.map.findLayerById('layerbjx') // 创立查问对象 let query = layer.createQuery() // 将点击的点放入查问对象中 query.geometry = { type: 'point', longitude: evt.mapPoint.longitude, latitude: evt.mapPoint.latitude } // 设置缓冲区 query.distance = 6 // 设置查问形式(相交) query.spatialRelationship = 'intersects' layer.queryFeatures(query).then((res) => { // 失去features对象 console.log(res.features) }) })

May 27, 2021 · 1 min · jiezi

关于arcgis:arcgis-for-js根据经纬度添加图片标注

1.申明三个包 esri/layers/GraphicsLayeresri/Graphicesri/geometry/Point2.申明GraphicsLayer并且add到map外面3.初始化图片标记点并且add到GraphicsLayer async ShowLocation() { let that = this const Graphic = await arcgisPackage.Graphic const GraphicsLayer = await arcgisPackage.GraphicsLayer const Point = await arcgisPackage.Point let layer = new GraphicsLayer() that.map.add(layer) var symbol = { type: "picture-marker", url: require('../../../assets/img/onepicture/ta.png'),//图片地址 width: "64px", height: "64px" }; var point = new Point(103.880812,27.802255); var gp = new Graphic(point,symbol); layer.graphics.add(gp); },

May 27, 2021 · 1 min · jiezi

关于arcgis:arcgis-for-js使用动态空间生成layer

workspaceIds在下图地位处dataSourceName是你的源数据名称 let layer = new FeatureLayer({ url: config.dynamicSpaceLayer, spatialReference: this.view1.spatialReference, dynamicDataSource: { type: 'data-layer', dataSource: { type: 'table', workspaceId: 'shp', dataSourceName: shpUrl } }/* popupTemplate: { title: '图斑详情', content: '{*}' } */})arcgis manager后盾参考资料链接

May 14, 2021 · 1 min · jiezi

关于arcgis:ArcGIS-for-JS-argis地图限制显示特定区域

arcgis地图服务限度特定区域,其余不显示的地图遮罩起来 办法一:应用canvas的clearRect办法,实现镂空成果办法二:应用canvas的path实现镂空成果 clearRect办法: var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.fillStyle="#fff"; ctx.fillRect(0,0,300,150); ctx.clearRect(20,20,100,50);

August 3, 2020 · 1 min · jiezi

关于arcgis:ArcGIS-for-JS-连接在线地图服务

dojoRequire(["esri/map", "esri/geometry/Point", "esri/layers/ImageParameters", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/GraphicsLayer", ], (Map, Point, ImageParameters, ArcGISDynamicMapServiceLayer,GraphicsLayer) => { map = new Map("map", { basemap: "satellite", center: [113.36112, 23.12467], zoom: 11, }); var dynamicMapServiceLayer = new ArcGISDynamicMapServiceLayer("http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer", { "opacity" :1.0, }); map.addLayer(dynamicMapServiceLayer); })

August 3, 2020 · 1 min · jiezi

GIS数学基础05地图投影分类

1. 根据地图投影的变形(内蕴的特征)分类等角投影(conformal projection)地球表面上无穷小图形投影后仍保持相似,或两微分线段所组成的角度在投影后仍保持不变 。在等角投影中,=0, a=b,=900 等面积投影(equivalent projection)地球面上的图形在投影后保持面积不变。在该投影中,vp=0,p=a· b =1 任意投影既不具备等角性质,又没有等面积性质的投影。其中一特例是等距离投影(equidistant projection),即该投影只在某些特定方向上没有变形,如 a=1或b=1 2. 根据投影面与地球面的相关位置分类正轴投影投影面的中心线与地轴一致 斜轴投影投影面的中心线与地轴斜交 横轴投影投影面的中心线与地轴垂直 3. 根据正轴投影时经纬网的形状分类圆锥投影投影中纬线为同心圆圆弧,经线为圆的半经 圆柱投影投影中纬线为一组平行直线,经线为垂直于纬线的另一组平行直线,且两相邻经线之间的距离相等 方位投影投影中纬线为同心圆,经线为圆的半径,且经线间的夹角等于地球面上相应的经差 伪圆锥投影投影中纬线为同心圆圆弧,经线为交于圆心的曲线 伪圆柱投影投影中纬线为一组平行直线,而经线为某种曲线 伪方位投影投影中纬线为同心圆,而经线为交于圆心的曲线 多圆锥投影投影中纬线为同轴圆圆弧,而经线为对称中央直径线的曲线

August 20, 2019 · 1 min · jiezi

ArcGis-for-JavaScript-SDK

ArcGis for JavaScript SDK作者:BLUE日期:2019-07-09 描述:arcgis for js 开发包,基于arcgis for js 3.9 点击【这里】下载SDK 该开发包是基于arcgis for javascript 3.9,是对原始API的一个扩充,原始API正常使用,该SDK仅封装了开发过程中常用的方法,开发包内使用瓦片下载的方式对全国天地图底图进行加载,默认坐标系为WGS 84,如果你是CGCS2000坐标系,那你可以放心使用;如果需要使用其他REST服务作为底图,你可以构造BaseMap实例的时候自己指定坐标系。 目录使用步骤BaseMap类(基础底图类) initTdt() -- 初始化全国天地图底图initTiledMap(sldtserver?,slbzserver?,yxdtserver?) -- 初始化缓存映射服务资源作为底图changeBaseMap(id) -- 切换底图类型toggleLable() -- 切换标注goto(lng, lat , zoom?) -- 定位点,将点拉到屏幕中心adbLayer(layer, index?) -- 附加图层,可用于图层管理hideAttachLayer(name) -- 隐藏附加图层showAttachLayer(name) -- 显示附加图层destoryAttachLayer(name) -- 销毁附加图层hasLayer(name) -- 判断图层是否存在zoomIn(zoom) -- 放大地图zoomOut(zoom) -- 缩小地图addWMSLayer(url, name, extent, callback?) -- 添加WMS图层addPointGeoJsonLayer(name, url, infoTemplate1?, symbol?, callback?, options?, maxdraw?) -- 添加GeoJson点图层addLineGeoJsonLayer(name, url, infoTemplate1?, symbol?, callback?, options?, maxdraw?) -- 添加GeoJson线图层addGonGeoJsonLayer(name, url, infoTemplate1?, symbol?, callback?, options?, maxdraw?) -- 添加GeoJson线图层DrawLayer类(绘制类) ...

July 14, 2019 · 4 min · jiezi

CentOS-72-安装-ArcGIS-for-Server-104-笔记

CentOS 7.2 安装 ArcGIS for Server 10.4 笔记安装环境说明: CentOS 7.2 64 位(全新的腾讯云服务器)1. 安装 Xvfb$ yum install xorg-x11-server-Xvfb2. 创建 arcgis 用户组,创建arcgis用户// 创建用户组arcgis$ groupadd arcgis// 创建用户ags$ useradd -g arcgis ags// 设置用户 ags 的密码$ passwd ags3. 上传安装包并解压// 上传安装包$ scp ArcGIS_for_Server_Linux_104_149446.tar.gz root@x.x.x.x:/hgy/// 解压$ tar -xzvf ArcGIS_for_Server_Linux_104_149446.tar.gz/*解压后的文件夹下面有如下文件:Documentation Install.htm serverdiag Setup setup_resources其中 Setup 是程序安装脚本*/4. 切换到用户 ags,运行安装脚本// 执行安装脚本$ ./Setup运行安装脚本后会进行安装环境检测,检测通过才可以开始安装。 我的安装出现了以下错误提示: /*------------------------------------------------------------------------There were 2 failure(s) and 2 warning(s) found:FAILURES:------------------------------------------------------------------------*** DIAG003: The hostname of this machine contains one or more invalidcharacters. Valid characters include alpha numeric a-z, 0-9, '-'and '.' characters. See RFC952.*** DIAG005: For ArcGIS Server to run properly, the file handle limitsfor the install user are required to be set to 65535 and the number ofprocesses limits set to 25059. The current file handle limit is 1000000and the number of processes limit is 3893.To set these limits, you\'ll need to edit the /etc/security/limits.conffile as super user and add the following lines: ags soft nofile 65535 ags hard nofile 65535 ags soft nproc 25059 ags hard nproc 25059In order for the new values to take effect, you'll need to log out andthen log back in as the ags user. To verify, run: ulimit -Hn -Hu ulimit -Sn -SuFor additional details, see the ArcGIS for Server installation guide.WARNINGS:------------------------------------------------------------------------*** DIAG024: The hostname entry in the /etc/hosts file must be in thefollowing format: <IP> <FQDN> <Machine_name>For example: 111.222.333.444 hostname.esri.com hostnameFederating an ArcGIS Server site with Portal for ArcGIS will fail ifthis entry is formatted differently. Update the hostname entry beforecreating your ArcGIS Server site.*** DIAG004: The following required packages were not found: fontconfigThese packages are required for the proper support of ArcGIS Server.Check the ArcGIS for Server System Requirements for details.*/根据提示,一个一个地来解决问题。 ...

July 6, 2019 · 3 min · jiezi