ArcGIS for Server 发布的 2D 缓存地图服务 ArcGISImageServiceLayer ArcGIS for Server 发布的影像地图服务 GraphicsLayer 客户端图层不对应 isClickRecenter:按住 Shift 键,在地图上单击鼠标左键,是否将该点设为地图中心 isDoubleClickZoom:双击鼠标左键,是否进行放大地图操作 isPan:设置地图是否可以用鼠标移动 :是否允许滚轮进行缩放操作 isShiftDoubleClickZoom:按住 Shift 键,在地图上双击鼠标左键,是否将该点设为地图中心的同时进行缩放操作 geographicExtent:地图的地理坐标范围 onLoad:当第一个图层或者底图被添加到 Map 中的时候发生 onClick:在地图上发生单击的时候发生 onLayerAdd:当图层添加的时候发生 onLayersAddResult:当所有图层都添加结束后发生 ,使用 map.addLayers 方法之后 onLayersRemoved:当所有图层都移除后发生 onLoad:当第一个图层或者底图加载成功后发生 onMouseDown:当鼠标在地图上单击的时候发生
arcgis_js_v419_api:这个是ArcGIS的Api网站,部署后,我们可以引用这个网站里的JS,然后实现地图的使用。 然后添加字体类型,因为本地API会下载一些字体文件。 点击MIME类型。 ? 配置完成后,重启IIS,重启网站,清空浏览器缓存,然后我们的本地JS就可用了。 地图使用 想使用ArcGIS API for JavaScript4.x,我们得现有一个地图服务才行,我们可以安装一个Arcgis Server。 API JS 4.X本地化部署与地图的基础使用,就讲完成。
腾讯云精选爆款云服务器限时体验20元起,云数据库19.9元/年起,还有更多热门云产品满足您的上云需求
使用ArcGis开发地图 引用ArcGisJS 使用ArcGisJS开发地图,首先需要引入ArcGis的Js文件和CSS文件,引入方式有两种,一种是官网JS引用,一种是本地JS引用。 require有两个参数,第一个参数接收js文件地址,第二个参数输出一个函数,函数的参数返回引入js文件的js类,类顺序与上面引入js文件的顺序的一致。 监听事件 基础地图使用编写完后,我们编写一个监听事件,代码如下: //监听单击事件 view.on("click", function (event) { console.log(event 正确为这三个属性赋值后,我们就可以实现在地图上画两个图形(这里画圆点),并且点击图形弹出图形的属性。 结语 到此ArcGis实现地图管理就介绍完了。 PS:很多公司把会给会GIS开发的程序员更高的工资。
综述:本节讲述的是用Arcgis for js加载天地图的切片资源。 天地图的切片地图可以通过esri.layers.TiledMapServiceLayer来加载,在此将之进行了一定的封装,如下: 1、切片线划图——TDTLayer.js define(["dojo/_ map.addLayer(annolayer); var pro = new FeatureLayer("http://localhost:6080/arcgis ,我还添加了一个我本机用Arcgis Server发布的特征层,完成后效果如下: ? 本文抛砖引玉,更多的天地图如影像等请参照:http://www.tianditu.com/guide/index.html
本文主要介绍如何在Vue和React项目中使用ArcGIS JS API进行开发,与以往的esri-loader开发方式不同的是,本文使用的是@arcgis/cli脚手架的开发方式。 2.2、项目创建成功后,我们进入到项目根目录,然后通过如下命令来启动: npm run serve 2.3、项目启动后会自动打开浏览器,默认端口是8080,然后会出现证书信任问题,我们只需要点击信任 ,然后继续执行即可,如下所示: 上图中可看到,项目是成功启动了,但是地图并没有实例化出来,打开控制台一看,有7条报错: 这时候我们再返回到创建的项目根目录,阅读README文档: 由文档可看到, 2.4、在项目根目录,通过如下命令正确运行项目: npm start 此时可以看到,我们的项目正确运行,并实例化了一张地图,并且添加了图例组件和一张业务图层,并且该图层开启了Identify 2.6、此项目中所用的ArcGIS JS API是最新的4.14版本,地址引用的是官网地址。
iOS Framework 的形式提供, 与 iOS 自带的 MapKit 相比, 提供了很多强大的地图以及分析功能, 如果你要想要在 iOS 平台上实现类似下图的应用, ArcGIS SDK for , 双击即可安装。 在编译设置标签的搜索框输入 Framework Search Paths 可以快速找到框架搜索路径设置, 双击右边的空白处, 点击 + 按钮并输入下面的路径: $(HOME)/Library/SDKs/ -all_load -ObjC -framework ArcGIS , 点击文本框外任意位置, 保存输入选项, 如下图所示: ? 现在可以生成并运行 AGSTestCS 项目, 可以看到一个地图应用在 iOS 模拟器启动, 这就表示一切都成功了!
本文在上一篇文章的基础之上,介绍下OSGB的倾斜摄影数据如何导入ArcGIS平台做数据处理、服务发布和前端ArcGIS JS API调用显示的一整套流程。 数据准备 OSGB数据(2000坐标系) 一份2000坐标系的shp数据,作为底图(或者用天地图底图,具体使用见昨天的文档) 以上的OSGB数据应该是带有相应元数据信息的xml文件的,单个的OSGB数据在制作 3、发布后的服务我们可以在Portal或者Online的ontent面板中看到,如下: 4、具体服务地址可以点击相应的服务后,在右下角看到地址,如下: 前端调用 1、发布后的服务在前端需要调用的话需要用到 ArcGIS JS API,所以我们要编写相应的代码,具体的调用代码如下: <! ,第一个是文章刚开始时提到的关于底图地址,第二个是发布后的倾斜摄影的服务地址,然后将代码保存在html文件中,通过本地服务访问即可,最后效果如下: 附: 底图制作与发布 1、加载相应的地图数据到Pro
:是否地图平移 isPanArrows:是否箭头显示地图上平移 isScrollWheelZoom:是否滑轮旋转缩放 isShiftDoubleClickZoom:是否按下shift键并双击缩放 isZoomSlider (mapPoint):设为中心点 destroy():销毁地图 disableClickRecenter():禁止单击重定位 disableDoubleClickZoom():禁止双击缩放 disableKeyboardNavigation ():禁止按下shift键并双击缩放 disableSnapping():禁止闪光 enableClickRecenter():允许单击重定位 enableDoubleClickZoom():允许双击缩放 toScreen(mapPoint):转换为屏幕坐标 Map 事件 basemap-change:底图改变 before-unload:卸载前 click:单击事件 dbl-click:双击事件 extent-change Arcgis Javascript API 提供了5种类型的图层,分别是地图切片图层、动态地图图层、图形图层、带地理参考的影像图层以及KML图层,这些图层类都继承于Layer类,分别是:TiledMapServiceLayer
B/S架构的开发这块,我们其实只需要掌握一个地图库即可,因为需要调用地图库里面的一些接口来实例化地图和图层,进而进行一些地图交互这些,所以大家可以知道,ArcGIS JS API其实是一个地图库,这个地图库是由 除了ArcGIS的JS地图库之外,其实还有超图的JS地图库、百度地图的JS地图库、高德地图的JS地图库等,还有很多开源的地图库。 JS API的基础知识,实例化一个地图并在前端浏览器展示;最后尝试着去学习ArcGIS JS API官网上更多的内容,去实现一个小型的demo系统,实现图层增删改查、渲染、空间分析等功能。 ArcGIS JS API使用流程 经过上述一大部分的介绍性内容后,我们这节来介绍下如何简单的使用ArcGIS JS API,我们最终会实现如下所示的一张二维地图: 如果你对上述地图的实现过程比较好奇的话 1、新建一个HTML文件并初始化HTML页面结构 2、加载ArcGIS JS API的js开发包和css样式包 3、新建存放地图的DOM节点并设置样式 4、实例化地图的逻辑代码编写 4.1、通过
当我们用ArcGIS JS API 4版本实例化完一张二维地图的时候,鼠标移入地图区域内进行点击时,在地图周围会出现一个5像素的黑色边框,虽然不影响其他功能,但是看起来不太美观,所以本文介绍下如何去除ArcGIS JS API 4.16实例化后的地图拖动时默认自带的5px的外边框,这种方法对4版本的API都是通用的。 问题描述 使用ArcGIS JS API 4.16实例化完地图后,当我们的鼠标拖动地图时发现地图的四周会默认自带一圈的外边框,这在我们的系统中看起来是很不协调的,大致样子如下所示: 就像上图中的四周, 解决方法 1、通过在浏览器的控制台扑捉元素后发现,当我们的鼠标点击拖动地图时,我们存放地图的dom元素节点上会增加一个after的伪类,这个默认自带的外边框就是在这个伪类中定义的,所以找到问题后就好解决了 important; } 2、通过在样式文件中写进去那两行自定义样式后,就发现拖动地图时不再有默认的边框了。
概述: 在前面的文章里提到了Arcgis for js加载天地图,在本节,继续讲解如何在Arcgis for js中加载百度地图。 效果: ? 地图 ? 影像-无标注 ? 第二,百度地图可调用的有地图切片,影像切片,以及道路等POI切片,我将之用TiledMapServiceLayer做了扩展,成了BDAnoLayer,BDVecLayer,BDimgLayer三个图层, ,在上述那边博文里面提到的url已经失效,为了得到最新的地址,我做了如下工作: 1、用百度地图JS API调用并显示百度地图,代码如下: <! map.centerAndZoom(new BMap.Point(116.404, 39.915), 5); // 初始化地图,设置中心点坐标和地图级别 map.addControl (new BMap.MapTypeControl()); //添加地图类型控件 map.setCurrentCity("北京"); // 设置地图显示的城市 此项是必须设置的
,下载到相应版本的开发包之后鼠标双击开发包安装。 依次点击VS顶部菜单中的【扩展 | 管理扩展】菜单,然后会打开管理扩展界面,在管理扩展界面我们点击左侧如下图所示的子菜单,然后在右上角搜索框中输入”ArcGIS Pro SDK”来搜索要安装的开发包: ,在每个版本开发包的页面最底部有开发包下载链接,如下(在这里我机子上是Pro 2.5,所以我选择了2.5版本的开发包): 4.3、将上图中所示的两个开发包下载之后,鼠标双击就会进入开发包的自动安装界面 ,它会自动地将安装包安装到我们机子上的VS中。 8、项目创建完成之后,我们点击VS顶部菜单的【运行】按钮即可启动项目,项目具体如下图所示: 项目代码结构如下图所示: 9、至此,我们ArcGIS Pro SDK for Microsoft .NET
ArcGis Server安装 下载ArcGisServer 双击Setup.exe,然后一直下一步。 ? ? ? ? ? ? ? ? 安装完成后,点击完成,弹出如下界面: ? 配置完成后点击【完成】按钮,ArcGIS Server开始创建站点,创建站点需要一点时间,如下图: ? 站点创建完成后,使用刚刚创建站点设置的用户名和密码进行登录,如下图: ? 登录成功后,ArcGIS Server管理器会显示本站点发布的所有服务,如下图。 (“SampleWorldCities”为ArcGIS Server管理器自带的地图服务,可用于测试) ? ArcGis Server使用 点击SampleWorldCities服务,进入服务管理页面,如下图: ? 默认会选中左侧常规菜单,常规菜单中,我们可以看到地图名称和地图类型。 点击功能,查看地图功能,如下图: ? 功能中配置的REST URL,是我们的ArcgisJS使用的地图地址。 点击REST URL查看服务提供的功能,如下图: ?
本文主要介绍下如何使用ArcGIS JS API对后台接口返回的数据进行渲染,文章中的后台返回数据使用单独的配置文件来处理,详情请看文章内容。 在项目中为了实现点选查询,是在ArcGIS Server里面发布了一个要素服务,然后将其添加到地图上渲染,并实现了鼠标的点选查询功能,那这个功能可不可以不通过发布服务来实现呢? 想到这,打开电脑仔细翻看了了一下ArcGIS JS API的官方文档,发现好像是可以,所以就立即动手了,幸运的是,我成功了,先给大家上一张效果图: 上图中的鼠标点选查询,并出现弹窗的功能实现的数据来源并不是一个发布的要素服务 :', err); }); }, 3、地图初始化完成之后,我们引入我们的数据,这个过程就相当于是你用AJAX从后台拿到数据了,因为我的数据我单独放在了一份JS文件里。 objectIdField: 'ObjectID', }); view.map.add(layer); 5、到此为止呢,我们的数据点其实已经添加到地图上了,但这时候还不能点击查询
ArcGIS JavaScript API是一套基于客户端的API,用于开发高性能,易于使用的地图应用。它使你非常容易在你的网页中嵌入地图。 ArcGIS JavaScript API适用于非GIS专业人士,但是又需要在Web网页中嵌入地图的情况。 ArcGIS JavaScript API是一套基于客户端的API,用于开发高性能,易于使用的地图应用。它使你非常容易在你的网页中嵌入地图。 ArcGIS JavaScript API适用于非GIS专业人士,但是又需要在Web网页中嵌入地图的情况。 ·搜索地址并显示结果 (大致的中文意思如上,就是讲的ADF JS API和ARCGIS JS API的区别,下面还有一些重要的地方,我来译下吧,和大家一起分享下) 下面还有一句,陈述编写客户端JS脚本时的一个让人沮丧的事实
概述 当我既写了esri-loader方式来进行ArcGIS JS API的开发文章,又写了@arcgis/cli脚手架的方式来进行ArcGIS JS API的开发文章之后,相信很多小伙伴看到后会产生“ 选择纠结症”,我到底该用哪种方式来进行ArcGIS JS API的开发呢? $message('底图创建失败,' + err); }); }, // 创建三维地图 _createSceneView ,可以看到第一个方法中为了创建一个二维地图,我们用loadModules引入了相关的功能模块;第二个方法中为了创建三维场景,我们又用loadModules再次引入了所需的模块,这样在编码方式上就很繁琐。 换句话说,如果我们在什么地方要用JS API中的模块,那我们就要在相应的地方用loadModules引入所需的模块。
使用现代化的脚本进行 ArcGIS JS API 开发 ArcGIS JS API 基于古老的 JavaScript 框架 Dojo 开发, dojo 虽然是曾经的王者, 但是2020年的前端开发, 早已是 加载 ArcGIS JS API 中提供的模块 要使用 ArcGIS JS API 中提供的模块, 根据 ArcGIS JS API 提供的文档, 需要使用 dojo 提供的 require 函数, 示例代码如下 本地环境搭建 上面 StackBlitz 上的例子只是示例而已, 要想完整的体验使用 TypeScript 进行 ArcGIS JS API 开发, 最好还是搭建本地开发环境, 需要安装的工具有: Node.js 在集成的终端窗口中输入命令: npm install 等依赖项安装完成之后, 再输入命令: npm start 然后, 打开浏览器, 访问 http://localhost:3000/index.html 就可以看到地图页面 , 如下图所示: image.png 如果需要分发开发完成的成果, 只需要执行: npm run build 然后将 dist 目录打包分发即可。
简介 对比 TMS 地图瓦片和 Google/OSM/Bing/ESRI 地图瓦片编号的区别 实现 ArcGIS API for JS 加载 TMS 地图瓦片 1. 也正是这一差别,我最初在使用 ArcGIS JS API 加载本地 TMS 地图瓦片时发现瓦片在竖直方向的顺序一直是反的。 Google Map 地图瓦片编号 如若使用 ArcGIS JS API 加载 TMS 地图瓦片,有两种方案: 预先将所有瓦片的 y 轴编号转置一下,然后再加载,转置公式如下: TMS 瓦片数据不变,前端基于 ArcGIS JS API 直接定义 TMSLayer。 方案1确实可行,但有时离线地图服务不仅仅是给 ArcGIS JS API 使用的。
腾讯乐享,凝聚腾讯十年管理经验与精华,通过直播、文档、课堂、考试、学习地图、论坛、乐问、投票、活动、祝福、积分和证书等核心应用,满足政府、企业和学校在知识管理、学习培训、文化建设和内部沟通的多元化需求,提供全行业、多场景解决方案,助力数字化管理升级。
扫码关注云+社区
领取腾讯云代金券