ArcGIS API for Javascript 应用开发入门
2018-01-12 09:28
519 查看
ArcGIS API for JavaScript (JavaScript API)是ESRI根据JavaScript技术实现的调用ArcGIS Server REST API接口的一组脚本。当前的最新版本是Version 3.8。通过ArcGIS API for JavaScript可以将ArcGIS Server提供的地图资源嵌入到Web应用中。JavaScript API是基于Dojo框架的,使用了大量的Dojo技术,因此要想熟练掌握API用法,先要对Dojo框架有个深入的了解!
一:环境介绍
(1)ArcGIS API for JavaScript 3.7 下载地址:http://www.esri.com/apps/products/download/
(2)Eclipse 3.7 +Tomcat 7 +JDK 7
二:搭建步骤
(1)通过Eclipse 创建动态工程,如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202009/21/06ca14a1d56f9084aca692b40b2a3ab7)
点击Next :
![](https://oscdn.geek-share.com/Uploads/Images/Content/202009/21/4c9f24337772deb4bf80f5a65ebd0da4)
输入Project Name:ArcgisForJs,设置Target runtime,点击Finish,工程目录如下 :
![](https://oscdn.geek-share.com/Uploads/Images/Content/202009/21/7cbbd0da8380e74390e75274e4d5fbc0)
(2)在工程WebContent下创建文件夹 arcgis_js
(3)解压 arcgis_js_v37_api.zip ,拷贝 arcgis_js_v37_api\arcgis_js_api\library\3.7\3.7compact 下的内容到 arcgis_js 文件夹下。
(4)修改arcgis_js\init.js
和 arcgis_js\ js\dojo\dojo\dojo.js 两个文件,替换 [HOSTNAME_AND_PATH_TO_JSAPI]为 localhost:8080/ArcgisForJs/arcgis_js/ ,格式:IP:web服务器端口/工程名/创建的文件夹arcgis_js
(5)在WebContent下创建文件
index.html,内容如下:
(6)部署运行工程,访问http://localhost:8080/Arc
a869
gisForJs/index.html ,效果如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202009/21/652869f770ea03c9bf562665912c4a22)
一:环境介绍
(1)ArcGIS API for JavaScript 3.7 下载地址:http://www.esri.com/apps/products/download/
(2)Eclipse 3.7 +Tomcat 7 +JDK 7
二:搭建步骤
(1)通过Eclipse 创建动态工程,如下:
点击Next :
输入Project Name:ArcgisForJs,设置Target runtime,点击Finish,工程目录如下 :
(2)在工程WebContent下创建文件夹 arcgis_js
(3)解压 arcgis_js_v37_api.zip ,拷贝 arcgis_js_v37_api\arcgis_js_api\library\3.7\3.7compact 下的内容到 arcgis_js 文件夹下。
(4)修改arcgis_js\init.js
和 arcgis_js\ js\dojo\dojo\dojo.js 两个文件,替换 [HOSTNAME_AND_PATH_TO_JSAPI]为 localhost:8080/ArcgisForJs/arcgis_js/ ,格式:IP:web服务器端口/工程名/创建的文件夹arcgis_js
(5)在WebContent下创建文件
index.html,内容如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>My fisrt ArcGis Map</title> <link rel="stylesheet" type="text/css" href="http://localhost:8080/ArcgisForJs/arcgis_js/js/dojo/dijit/themes/tundra/tundra.css"/> <script type="text/javascript" src="http://localhost:8080/ArcgisForJs/arcgis_js/init.js"></script> <link rel="stylesheet" type="text/css" href="http://localhost:8080/ArcgisForJs/arcgis_js/js/esri/css/esri.css" /> <script type="text/javascript"> dojo.require("esri.map"); var myMap; function init() { myMap = new esri.Map("arcgisDiv"); var myTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer"); myMap.addLayer(myTiledMapServiceLayer); myMap.setZoom(4); } dojo.addOnLoad(init); </script> </head> <body class="tundra"> <div id="arcgisDiv" style="width:900px; height:600px; border:1px solid #000;"></div> </body> </html> |
a869
gisForJs/index.html ,效果如下:
相关文章推荐
- ArcGIS API for Javascript 应用开发入门
- ArcGIS API for Javascript 应用开发入门
- ArcGIS API for Javascript 应用开发入门
- ArcGIS API for Javascript 应用开发入门
- ArcGIS API for Silverlight开发入门(3):Widgets
- ArcGIS API for Silverlight开发入门
- arcgis api for flex 开发入门(四)Darw控件的使用
- ArcGIS.Server.9.3和ArcGIS API for JavaScript中GraphicsLayer应用(五)
- arcgis api for js入门开发系列一arcgis api离线部署
- ArcGIS API For Javascript开发利器(智能提示)和学习地址
- ArcGIS API for Silverlight开发入门(8):在程序中使用Virtual Earth的服务<转>
- ArcGIS API for Silverlight开发入门(5):任务外包——Tasks
- arcgis api for javascript 3.16开发(一)
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现查询定位中心的功能和FindTask功能应用(七)
- arcgis api for flex 开发入门(一)环境搭建
- ArcGIS API for Silverlight开发入门(2):一个基础地图实例
- arcgis api for flex 开发入门(一)环境搭建
- [专家讲座] ArcGIS API for Silverlight开发入门(7):使用非AGS数据源的图层(转)
- ArcGIS API for javascript开发笔记(七)——使用ArcGIS API for javascript调用GP服务
- 基于ArcGIS API for JavaScript的eChart迁徙线入门——画一条迁徙线