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

原址:http://www.cnblogs.com/hll2008/archive/2008/12/03/1347112.html

目的:
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提供的新功能,本例子中就用到了simplifyingcalculating 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="距离测量" οnclick="toolbar.activate(esri.toolbars.Draw.LINE);map.hideZoomSlider();" /> <input id="Button2" 
            type="button" value="面积测量" οnclick="toolbar.activate(esri.toolbars.Draw.POLYGON);map.hideZoomSlider();" /> <input id="Button3" type="button" 
            value="漫 游" οnclick="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.完成编码运行查看效果。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值