ArcGIS API for JavaScript 开发教程.docx

1、ArcGIS API for JavaScript 开发教程ArcGIS API for JavaScript 开发教程目的：1.ArcGIS.Server.9.3和ArcGIS API for JavaScript实现实现点、线、面的buffer分析，这里是通过GeometryServer实现。准备工作：1. 在ArcGis Server9.3中发布名为usa的MapServer。2. 在ArcGis Server9.3中发布名为Geometry的GeometryServer。完成后的效果图：开始0.关于GeometryServer的介绍，可以看本系列的第九篇。1.启动vs新建名为Buffe

2、rSample的ASP.NET Web应用程序。其实jsapi是纯客户端的开发了不需要vs也不需要.net了，纯html页面就可以了用记事本都可以开发了。我这里为了方便了就用vs2008了，毕竟可以调试js脚本了。2.接着在工程中添加名为javascript的文件夹并且在这个文件夹里新建wabapp.js的文件，这里用来编写我们自己的js代码了，在Default.aspx页面里添加对这个js文件的引用，同时在Default.aspx页面里添加一个id为map的div标签作为地图控件的载体、5个input的功能按钮、2个input的输入框、1个select选择列表： UntitledPageli

3、nkrel=”stylesheet”type=”text/css”href=”#Text1width:54px;     WKID:Buffer距离:英里码千米米海里美式海里度dd3、上面的html代码中主要可以看一下5个input按钮的onclick事件，分别实现了画点、画线、画面、漫游、清楚图形的代码很简单了，还有就是单位选择的select了已经添加了7个常用的单位。4、切换到wabapp.js编写js代码，本例子的js代码分为3部分功能，第一载入地图进行显示；第二进行画点、线、面操作；第三根据画的点、线、面图形进行buffer分析。具体的

4、说明看代码注释：dojo.require(“esri.map“);dojo.require(“esri.tasks.geometry“);dojo.require(“esri.toolbars.draw“);dojo.require(“esri.tasks.query“); djConfig=isDebug:true;varmap,tb,geometryService,queryTask,query;functioninit()startExtent=newesri.geometry.Extent(-183.780014745329,16.2975638854873,-61.406854741

5、0964,74.0304580085983,newesri.SpatialReference(wkid:4269);map=newesri.Map(“map“);/底图Tile图varimageryPrime=newesri.layers.ArcGISTiledMapServiceLayer(“map.addLayer(imageryPrime);varusa=newesri.layers.ArcGISDynamicMapServiceLayer(“http:/jh-53a435fbc0e8/ArcGIS/rest/services/USA/MapServer“);/设置要显示的图层/usa.

6、setVisibleLayers(0);/设置图层透明度usa.setOpacity(0.8);map.addLayer(usa);/设置地图视图范围map.setExtent(startExtent);geometryService=newesri.tasks.GeometryService(“http:/jh-53a435fbc0e8/ArcGIS/rest/services/Geometry/GeometryServer“);tb=newesri.toolbars.Draw(map);dojo.connect(tb,“onDrawEnd“,doDraw);/画图functiondoDra

7、w(geometry)/根据图形的类型定义显示样式switch(geometry.type)case“point“:varsymbol=newesri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE,10,newesri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,newdojo.Color(255,0,0),1),newdojo.Color(0,255,0,0.25);break;case“polyline“:var

8、symbol=newesri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH,newdojo.Color(255,0,0),1);break;case“polygon“:varsymbol=newesri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID,newesri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,newdojo.Color(0,0,0

9、),1),newdojo.Color(255,0,0,0.25);break;/把绘制的图形添加到map.graphics进行显示vargraphic=newesri.Graphic(geometry,symbol);map.graphics.add(graphic);/如果是面需要先进行simplify操作，否则直接进行bufferif(geometry.type=“polygon“)geometryService.simplify(graphic,doSimplify);elsedoBuffer(graphic);/simplify结束调用bufferfunctiondoSimplify(

10、graphics)doBuffer(graphics);functiondoBuffer(graphics)/buffer参数varparams=newesri.tasks.BufferParameters();/buffer的范围值，从输入框中获取params.distances=dojo.byId(distance).value;/空间参考params.bufferSpatialReference=newesri.SpatialReference(wkid:dojo.byId(“wkid“).value);/输出结果的空间参考params.outSpatialReference=map.s

11、patialReference;params.features=graphics;/buffer的单位，从列表框获取params.unit=eval(“esri.tasks.BufferParameters.“+dojo.byId(“unit“).value);/buffer操作geometryService.buffer(params,showBuffer);/显示buffer的结果functionshowBuffer(features)varsymbol=newesri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_S

12、OLID,newesri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,newdojo.Color(255,0,0,0.65),2),newdojo.Color(255,0,0,0.35);for(varj=0;jfeatures.length;j+)vargraphic=newesri.Graphic(featuresj.geometry,symbol);map.graphics.add(graphic);tb.deactivate();map.showZoomSlider();dojo.addOnLoad(

13、init);5、这样就完成了buffer的例子。标签：arcgis api javasrcipt、arcgis server 9.3、buffer 149 Views|1条评论 ArcGIS.Server.9.3和ArcGIS API for JavaScript保存自定义图形（十） 2009年09月10日 10:01 上午|分类：JavaScript目的：1.ArcGIS.Server.9.3和ArcGIS API for JavaScript实现自定义图形，保存自定义的Graphic图形到服务端的xml文件中，同时也能在地图载入时读入xml中的图形数据显示到地图中。 这里的自定义面的Lab

14、el是通过GeometryServer的labelPoints实现的。准备工作：1. 在ArcGis Server9.3中发布名为Geometry的GeometryServer。完成后的效果图：开始0.关于GeometryServer的labelPoints介绍，labelPoints允许在多边形中指定Label显示的位置点,是jsapi1.2才支持的新功能，需要需要ArcGIS Server 9.3 sp1支持。1.启动vs新建名为SaveGraphics的ASP.NET Web应用程序。2.接着在工程中添加名为javascript的文件夹并且在这个文件夹里新建mapfunc.js的文件，这

15、里用来编写我们自己的js代码了，在Default.aspx页面里添加对这个js文件的引用，同时在Default.aspx页面里添加一个id为map的div标签作为地图控件的载体、2个input的功能按钮： UntitledPageimport”scripttype=”text/javascript”src=”  3、上面的html代码很简单主要是2个input的画图、漫游功能按钮。4、切换到mapfunc.js开始编写js代码，现在从执行顺序来说明代码。5、首先是初始化地图显示的init()方法：functioninit()map=newesri.Map(“map“,ext

16、ent:newesri.geometry.Extent(-183.780014745329,16.2975638854873,-61.4068547410964,74.0304580085983,newesri.SpatialReference(wkid:4269);varusamap=newesri.layers.ArcGISTiledMapServiceLayer(“map.addLayer(usamap);toolbar=newesri.toolbars.Draw(map);dojo.connect(toolbar,“onDrawEnd“,doDraw);/添加map载入后事件监听，用来

17、从xml中读入自定义的图形在地图上显示dojo.connect(map,“onLoad“,showGraphic);/设置infoWindow的大小map.infoWindow.resize(200,100);/设置infoWindow的标题头map.infoWindow.setTitle(“输入名称“);/实例化GeometryServicegeometryService=newesri.tasks.GeometryService(“http:/mypc/ArcGIS/rest/services/Geometry/GeometryServer“); 6、上面的init()方法中执行了dojo

18、.connect(map,”onLoad”,showGraphic);代码，所以接下来是showGraphic()方法代码：/map载入后事件监听，用来从xml中读入自定义的图形在地图上显示functionshowGraphic()/延迟1秒执行setTimeout(loadGraphic,1000);7、上面的showGraphic()方法调用了loadGraphic()方法，这样方法中用了dojo的ajax功能向服务端请求获取服务端的xmlData/xmlGraphic.xml数据，关于dojo.xhrGet方法可以参考dojo的帮助, 这里首先来看一下xmlGraphic.xml中保存的

19、数据，如下：-“geometry”:“rings”:-107.3883566182127,25.740182822042797,-112.9254659932127,25.828073447042797,-115.7379659932127,31.189401572042797,-110.8160909932127,31.540964072042797,-105.5426534932127,28.904245322042797,-107.3883566182127,25.740182822042797,”spatialReference”:“wkid”:4269,”attributes”:“id”:”0,”title”:”广东”,”s