ArcGIS JSAPI 学习教程 - 初识 ArcGIS Maps SDK for JavaScript

📅 发布时间:2026/10/13 1:39:01
ArcGIS JSAPI 学习教程 - 初识 ArcGIS Maps SDK for JavaScript
ArcGIS JSAPI 学习教程 - 初识 ArcGIS Maps SDK for JavaScriptJSAPI 介绍JSAPI HelloworldJSAPI 优势劣势在线示例近期由于工作需要开始接触ArcGIS Maps SDK for JavaScript以下简称JSAPI为了更好的系统的学习准备开设专栏作为学习记录。本文作为第一篇首先介绍一下 JSAPI 的概览、官方示例以及官方 API。然后完成 JSAPI 的 helloworld 以及注意事项。最后简述一下 JSAPI 的优势劣势。JSAPI 介绍1. JSAPI 概览ArcGIS Maps SDK for JavaScript 是 ESRI 公司开发的 Web 端地图库目前最新版本为4.28下文简称JSAPI。JSAPI 包含二维和三维部分其中二维跟 Openlayers 相当三维跟 Cesium 相当。不同的是JSAPI 是闭源的但是可以免费使用JSAPI 为了方便大家使用提供了一系列教程其中 API 和 示例代码最常用下边分别介绍。2. 官方示例官方示例Sample Code3. 官方 API官方 APIAPI Reference4. 官方资源地址linkrelstylesheethrefhttps://js.arcgis.com/4.28/esri/themes/light/main.cssscriptsrchttps://js.arcgis.com/4.28//script!--个人镜像资源--linkrelstylesheethrefhttps://openlayers.vip/arcgis/4.28/esri/themes/light/main.css/scriptsrchttps://openlayers.vip/arcgis/4.28/init.js/script官方下载地址JSAPI downloads注意需要注册登录也可以点这里下载CSDN JSAPI downloadsJSAPI HelloworldJSAPI 入门比较简单这里就贴一下代码注意事项都在注释里!DOCTYPEhtmlhtmllangenheadmetacharsetutf-8/metanameviewportcontentinitial-scale1,maximum-scale1,user-scalableno/titleIntro to SceneView - Create a 3D map | Sample | ArcGIS Maps SDK for JavaScript 4.28/titlestylehtml, body, #viewDiv{padding:0;margin:0;height:100%;width:100%;}/style!--个人镜像资源--linkrelstylesheethrefhttps://openlayers.vip/arcgis/4.28/esri/themes/light/main.css/scriptsrchttps://openlayers.vip/arcgis/4.28/init.js/scriptscriptrequire([esri/Map,esri/views/SceneView],(Map,SceneView){// 创建地图constmapnewMap({// 基础图层basemap:satellite,// 地形高程ground:world-elevation});// 创建地图视图constviewnewSceneView({// 地图容器container:viewDiv,// 传入地图对象map:map,// 地图相机camera:{// 初始位置position:{// 坐标系// 坐标系spatialReference:{wkid:4326},x:115,y:32,z:18161244.728082635},// 初始视角heading:0,tilt:0.49}});});/script/headbodydividviewDiv/div/body/htmlJSAPI 优势劣势JSAPI 优势JSAPI 优势很明显功能齐全切强大封装了大量项目中常用的功能尤其是数据查询、数据渲染相关的。比如几何数据渲染、几何分析、要素查询、可视化渲染等。熟练的使用这些方法可以迅速的完成常规的漂亮的项目。另外JSAPI 依据 ArGIS 强大的功能利用 WASM 实现了很多前端难以实现的功能Graphics点线面以及几何体通常几何体需要自己用 mesh 实现。Analysis分析功能JSAPI 提供一个几何分析的引擎以及其他各种分析功能。Query查询功能包含客户端查询和服务端查询。Visualization可视化功能各种形式展示数据非常常用。JSAPI 劣势JSAPI 作为闭源地图库社区活跃人数相对较少因此遇到问题或者想要实现一些复杂功能就比较困难。自己研究 JSAPI 源码扩展功能一是违背闭源原则另外就是也非常困难。除此之外JSAPI 对外开放的接口较少对于很多地图对象想要扩展使用很不容易。比如想要实现几何体立方体、管道等就需要自己通过三角面实现比如想要实现可视域分析难度就比较大。而对于 Cesium 就相对容易一些。在线示例JSAPI 在线示例jsapi-helloworld