ArcGIS.Server.9.3和ArcGIS API for JavaScript实现距离量算和面积量算（九）

目的：
1.ArcGIS.Server.9.3和ArcGIS API for JavaScript实现距离量算和面积量算，这里主要是通过GeometryServer实现。
准备工作：
1. 在ArcGis Server9.3中发布名为usa的MapServer。
2. 在ArcGis Server9.3中发布名为Geometry的GeometryServer。
完成后的效果图：

开始
0.关于GeometryServer的介绍，Geometry Service，Geometry Service是给程序提供几何计算如 buffering, simplifying, calculating areas 、lengths,  projecting等功能，Geometry Service可以用来代替ArcObjects 或geoprocessing service等做的这些几何计算，它是ArcGIS Server 9.3提供的新功能，本例子中就用到了simplifying、calculating areas 、lengths、projecting四个功能。
1.启动vs新建名为MeasureSample的ASP.NET Web应用程序。其实jsapi是纯客户端的开发了不需要vs也不需要.net了，纯html页面就可以了用记事本都可以开发了。我这里为了方便了就用vs2008了，毕竟可以调试js脚本了。
2.接着在工程中添加名为javascript的文件夹并且在这个文件夹里新建wabapp.js的文件，这里用来编写我们自己的js代码了，在Default.aspx页面里添加对这个js文件的引用，同时在Default.aspx页面里添加一个id为map的div标签作为地图控件的载体、3个input的功能按钮、一个信息显示的span：

<% @ Page Language = " C# "  AutoEventWireup = " true "  CodeBehind = " Default.aspx.cs "  Inherits = " MeasureSample._Default "   %>

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml"   >
< head  runat ="server" >
     < title > Untitled Page </ title >
     < link  rel ="stylesheet"  type ="text/css"  href ="http://serverapi.arcgisonline.com/jsapi/arcgis/1.2/js/dojo/dijit/themes/tundra/tundra.css" >
     < script  type ="text/javascript"  src ="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.2" ></ script >
     < script  type ="text/javascript"  src ="javascript/webapp.js" ></ script >
</ head >
< body  class ="tundra" >
     < form  id ="form1"  runat ="server" >
     < div >
         < input  id ="Button1"  type ="button"  value ="距离测量"  onclick ="toolbar.activate(esri.toolbars.Draw.LINE);map.hideZoomSlider();"   />   < input  id ="Button2"  
            type ="button"  value ="面积测量"  onclick ="toolbar.activate(esri.toolbars.Draw.POLYGON);map.hideZoomSlider();"   />   < input  id ="Button3"  type ="button"  
            value ="漫 游"  onclick ="toolbar.deactivate();map.showZoomSlider();"   />< span  id ="distance" ></ span ></ div >
     < div  id ="map"  class ="tundra"  style ="width:512px; height:400px; border:1px solid #000;" ></ div >
     </ form >
</ body >
</ html >

3.上面的html代码非常的简单了，主要可以看一下3个功能按钮的onclick事件方法。
4.切换到 wabapp.js文件编写js功能代码，功能主要是分为3部分，第一载入地图进行显示；第二在地图上进行画线画面的功能；第三根据画的线或者面进行距离或者面积的量算。
5.这样讲一下关于距离和面积的量算，本例子的地图数据usa是采用是地理坐标系wkid为4269，要进行距离或者面积时就必须转换到大地坐标系下，就是地图投影了。本例子中用 GeometryServer的project方法把usa投影到大地坐标系下 wkid为32618。所以这里无论是距离测量还是面积测量首先必须进行project，对于距离测量完成投影后就可以直接用GeometryServer的lengths方法进行测量，对于面积测量还需要先进行simplify操作后在用GeometryServer的areasAndLengths方法进行测量。
6.具体的代码和说明如下：

dojo.require( " esri.map " );
dojo.require( " esri.toolbars.draw " );
dojo.require( " esri.tasks.geometry " );

var  map, toolbar, symbol, geometryService;
function  init()
{
   map  =   new  esri.Map( " map " );
    var  dynamicMapServiceLayer  =   new  esri.layers.ArcGISDynamicMapServiceLayer( " http://mypc/ArcGIS/rest/services/USA/MapServer " );
   map.addLayer(dynamicMapServiceLayer);
   toolbar  =   new  esri.toolbars.Draw(map);
    // 添加toolbar画图完成后天事件监听调用doMeasure
   dojo.connect(toolbar,  " onDrawEnd " , doMeasure);
   
    // 实例化GeometryService，地址为ags发布的GeometryServer
   geometryService  =   new  esri.tasks.GeometryService( " http://mypc/ArcGIS/rest/services/Geometry/GeometryServer " );
    // 添加onProjectComplete完成后事件监听
   dojo.connect(geometryService,  " onProjectComplete " , projectComplete);
}

// 量算
function  doMeasure(geometry)
{
    // 更加类型设置显示样式
    switch  (geometry.type)
   {
       case   " polyline " :
          var  symbol  =   new  esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,  new  dojo.Color([ 0 , 0 , 0 ]),  2 );
          break ;
       case   " polygon " :
          var  symbol  =   new  esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE,  new  esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT,  new  dojo.Color([ 255 , 0 , 0 ]),  2 ),  new  dojo.Color([ 255 , 255 , 0 , 0.25 ]));
          break ;
   }
    // 设置样式
    var  graphic  =   new  esri.Graphic(geometry, symbol);
    // 清除上一次的画图内容
   map.graphics.clear();
    //
   map.graphics.add(graphic);
    // 进行投影转换，完成后调用projectComplete
   geometryService.project([graphic], new  esri.SpatialReference({ " wkid " : 32618 }));
}

// 投影转换完成后调用方法
function  projectComplete(graphics)
{
   // 如果为线类型就进行lengths距离测算
   if (graphics[ 0 ].geometry.type == " polyline " )
  {
     dojo.connect(geometryService,  " onLengthsComplete " , outputDistance);
     geometryService.lengths([graphics[ 0 ]]);
  }
   // 如果为面类型需要先进行simplify操作在进行面积测算
   else   if (graphics[ 0 ].geometry.type == " polygon " )
  {
     dojo.connect(geometryService,  " onSimplifyComplete " , simplifyComplete);
     geometryService.simplify([graphics[ 0 ]]);
  }
}

// 显示测量距离
function  outputDistance(result)
{
   dojo.byId( " distance " ).innerHTML  =   " 距离： " + dojo.number.format(result.lengths[ 0 ]  /   1000 )  +   " 千米 " ;
}

// 显示测量面积
function  outputAreaAndLength(result)
{
   dojo.byId( " distance " ).innerHTML  = " 面积： " +  dojo.number.format(result.areas[ 0 ]  /   1000000 )  +   " 平方公里 " + "  长度： " + dojo.number.format(result.lengths[ 0 ] / 1000) + "千米";
}

// 对面对象simplify完成后调用方法
function  simplifyComplete(graphics)
{
  dojo.connect(geometryService,  " onAreasAndLengthsComplete " , outputAreaAndLength);
   // 进行面积测量
  geometryService.areasAndLengths(graphics);
}

dojo.addOnLoad(init);

7.完成编码运行查看效果。