Arcgis for Js之GeometryService实现测量距离和面积

距离和面积的测量时GIS常见的功能,在本节,讲述的是通过GeometryService实现测量面积和距离。先看看实现后的效果:

                             
  

距离                                                                                         面积

首先,进行配置:

//identify proxy page to use if the toJson payload to the geometry service is greater than 2000 characters.
//If this null or not available the project and lengths operation will not work.  Otherwise it will do a http post to the proxy.
esriConfig.defaults.io.proxyUrl = "/proxy";
esriConfig.defaults.io.alwaysUseProxy = false;

接着,定义GeometryService和绘图工具:

var gsvc = new GeometryService("http://localhost:6080/arcgis/rest/services/Utilities/Geometry/GeometryServer");
var measureToolbar = new esri.toolbars.Draw(map);

接下来,绘图结束后将所绘制图形添加到地图上面,并返回测量结果,那么增加measureToolbar的draw-end事件:

            measureToolbar.on("draw-end",showMeasureResults);
            /**
             * 显示测量结果
             * @param evt
             */
            var showPt=null;
            function showMeasureResults(evt){
                measureToolbar.deactivate();
                map.setMapCursor("default");
                var geometry = evt.geometry;
                switch (geometry.type) {
                    case "polyline":{
                        var length = geometry.paths[0].length;
                        showPt = new Point(geometry.paths[0][length-1],map.spatialReference);
                        var lengthParams = new LengthsParameters();
                        lengthParams.lengthUnit = esri.tasks.GeometryService.UNIT_KILOMETER;
                        lengthParams.polylines = [geometry];
                        gsvc.lengths(lengthParams);
                        break;
                    }
                    case "polygon":{
                        showPt = new Point(geometry.rings[0][0],map.spatialReference);
                        var areasAndLengthParams = new AreasAndLengthsParameters();
                        areasAndLengthParams.lengthUnit = esri.tasks.GeometryService.UNIT_KILOMETER;
                        areasAndLengthParams.areaUnit = esri.tasks.GeometryService.UNIT_SQUARE_KILOMETERS;
                        gsvc.simplify([geometry], function(simplifiedGeometries) {
                            areasAndLengthParams.polygons = simplifiedGeometries;
                            gsvc.areasAndLengths(areasAndLengthParams);
                        });
                        break;
                    }
                }
                var graphic = new Graphic(geometry, getGeometrySymbol(geometry.type));
                map.graphics.add(graphic);
            }

根据geometry的类型,增加GeometryService的lengths-complete或者areas-and-lengths-complete事件:

            gsvc.on("lengths-complete",outputLength);
            function outputLength(evtObj){
                var result = evtObj.result;
                showmeasureInfo(showPt, result.lengths[0].toFixed(3), "千米");
            };
            gsvc.on("areas-and-lengths-complete",outputAreaAndLength);
            function outputAreaAndLength(evtObj){
                var result = evtObj.result;
                showmeasureInfo(showPt, result.areas[0].toFixed(3), "平方千米");
            };

最后,将返回的结果显示在地图上:

            /**
             * 显示测量结果
             * @param showPnt
             * @param data
             * @param unit
             */
            function measureInfo(showPnt,data,unit){
                var measureDiv=$("#measure");
                var isShow = false;
                var screenPnt=map.toScreen(showPnt);
                measureDiv.css("left",screenPnt.x+"px");
                measureDiv.css("top",screenPnt.y+"px");
                measureDiv.css("position","absolute");
                measureDiv.css("height","20px");
                measureDiv.css("display","block");
                isShow = true;
                measureDiv.css("z-index","999");
                if(unit==="千米"){
                    measureDiv.css("width","90px");
                }
                else{
                    measureDiv.css("width","130px");
                }
                $("#result").html(data+unit);
                $("#infoclose").click(function(){
                    map.graphics.clear();
                    measureDiv.css("display","none");
                    isShow = false;
                });

                map.on("pan-start", function(){
                    measureDiv.css("display","none");
                });

                map.on("pan-end", function(panend){
                    if(isShow == true){
                        screenPnt=map.toScreen(showPnt);
                        measureDiv.css("left",screenPnt.x+"px");
                        measureDiv.css("top",screenPnt.y+"px");
                        measureDiv.css("position","absolute");
                        measureDiv.css("height","20px");
                        measureDiv.css("display","block");
                    }
                });
                map.on("zoom-start", function(){
                    measureDiv.css("display","none");
                });
                map.on("zoom-end", function(){
                    if(isShow == true){
                        screenPnt=map.toScreen(showPnt);
                        measureDiv.css("left",screenPnt.x+"px");
                        measureDiv.css("top",screenPnt.y+"px");
                        measureDiv.css("position","absolute");
                        measureDiv.css("height","20px");
                        measureDiv.css("display","block");
                    }
                });
            };

结果的显示我是通过一个div来显示的,并且做了缩放和地图移动的处理。

时间: 2024-10-10 03:27:03

Arcgis for Js之GeometryService实现测量距离和面积的相关文章

(转)Arcgis for Js之GeometryService实现测量距离和面积

http://blog.csdn.net/gisshixisheng/article/details/40540601 距离和面积的测量时GIS常见的功能,在本节,讲述的是通过GeometryService实现测量面积和距离.先看看实现后的效果:                                  距离                                                                                         面积

OpenLayers测量距离和面积

<!DOCTYPE html> <html> <head> <title>测量距离和面积</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-s

如何快速测量CAD图纸中的距离、面积

在繁忙的CAD绘图工作中,我们常常需要测量各种不同CAD图纸中的距离.面积.我们是否有更加方便的方法,一键操作快速测量CAD图纸中的距离.面积呢?当然有.如此方便的快速测量方法,大大提高我们绘图工作效率的同时,也减轻了我们的工作负担.今天小编就在此给大家具体演示一下.演示操作如下:打开测量距离.面积的CAD图纸1.先运行迅捷CAD编辑器建筑版,打开我们需要测量距离.面积的CAD图纸. 2.然后点击软件右侧工具选项板里的查询选项,调用出查询选项面板.测量距离1.我们点击查询--距离图标,调用查询距

Arcgis for js之GP实现缓冲区计算

概述: GP服务的存在使得在Web端使用ArcGIS 提供的空间分析,而这些分析的能力是和桌面中的一样的.因此,是Arcgis for js的一个重点,也是一个难点.因此,在本文讲述如何发布并在代码中调用GP服务,实现缓冲区的分析计算. 简介: 框架介绍参考文章:http://www.cnblogs.com/HPhone/archive/2012/11/05/2755833.html 服务发布参考文章:http://www.cnblogs.com/HPhone/archive/2012/11/1

Arcgis for JS之Cluster聚类分析的实现(基于区域范围的)

原文:Arcgis for JS之Cluster聚类分析的实现(基于区域范围的) 咱们书接上文,在上文,实现了基于距离的空间聚类的算法实现,在本文,将继续介绍空间聚类之基于区域范围的实现方式,好了,闲言少叙,先看看具体的效果: 聚类效果 点击显示信息 显示单个聚类点 下面说说具体的实现思路. 1.数据组织 在进行数据组织的时候,因为是要按照区域范围的,所以必须得包含区域范围的信息,在本示例中,我用的数据依然是全国2000多个区县点的数据,并添加了省市代码,数据如下: 2.聚类思路 根据数据中“p

Arcgis for JS之Cluster聚类分析的实现

原文:Arcgis for JS之Cluster聚类分析的实现 在做项目的时候,碰见了这样一个问题:给地图上标注点对象,数据是从数据库来 的,包含XY坐标信息的,通过graphic和graphiclayer 的方式添加到地图上,其中有一个对象的数量很多,上万了吧,通过上述的方式无法在地图上进行展示,就想到了聚类,当时由于技术和时间的关系,没有实现,最 近,稍微有点先下时间,就又想起这事,继续研究,终于,皇天不负有心人,出来了,出来的第一时间写出来,以便大家使用. 首先,看看实现后的效果: 初始化

arcgis for js如何画台风风圈

转自:https://blog.csdn.net/leftfist/article/details/78984533#commentBox arcgis for js里面,画一个圆不是什么难事.小的可以用SimpleMarkerSymbol,"style": "esriSMSCircle": 大的话,直接就来一个new Circle 但是,如果是类似台风风圈这类的呢? 似圆非圆,该咋画? 答案是画多边形.如图所示的风圈,正是3个多边形.其实所谓的圆,不就是多边形无限

Arcgis for Js实现graphiclayer的空间查询

本节讲的是Arcgis for Js的针对graphiclayer的空间查询,内容非常easy.代码例如以下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-

arcgis for js开发之路径分析

arcgis for js开发之路径分析 //方法封装 function routeplan(x1, x2, y1, y2, barrierPathArray, isDraw, callback) { require([ "esri/symbol/SimpleLineSymbol", "esri/Color", "esri/tasks/RouteTask", "esri/tasks/FreatureSet", "es