【转】使用arcgis javascript api 保存不规则面状数据(镂空、自相交)

使用arcgis javascript. api 编辑面状数据的时候,如果面状数据出现自相交(如八字形、多部分、镂空等情况),在使用FeatureLayer的applyEdits函数进行保存时,会保存不成功。 一般来说,保存不成功脚本是不会有任何提示的,必须要对编辑事件进行监控,让其抛出提示,可以参考featureLayer里面的事件onEditsComplete(addResults, updateResults, deleteResults) 事件。在地图初始化时加载featureLayer,然后给featureLayer注册事件,使用dojo.connect的方式,如下dojo.connect(editLayer,"onEditsComplete",editCalled); 其中editLayer就是对应的FeatureLayer,onEditsComplete是FeatureLayer的事件,editCalled是这个事件所触发的执行方法。

function editCalled(addResults,updateResults, deleteResults){
       if(addResults[0].success==true){
           alert("保存成功");
        }else{
               alert("保存失败");
       }
  }

 

接下来要对面图形进行处理,由于客户端脚本无法对自相交的面数据进行运算,那么,我们可以借助Geometry Service的simplify函数,处理后的图形就会由于一个ring变成实际上的多个ring。(注:arcgis 体系下,polygon是由多个ring组成的,默认情况下polygon都是一个ring。出现自相交的时候,polygon这个默认的ring实际上已经是错误的,因此无法对图形进行保存)。这种方法的原理在于通过simplify把polygon变成多个ring再进行保存。原理很简单,但其中有一点要注意的,simplify处理时需要一定的时间,必须要等待期处理完成后重设graphic的图形才能保存。因此,必须要对simplify进行监听。gsvc.simplify([geometry],doSave); doSave函数负责处理新的图形。如下代码段

function doSave(geometries){
 alert("Ring的数目 = " + geometries[0].rings.length);
       gra.setGeometry(geometries[0]);  //gra是之前已经声明的graphic
 }

以下是面编辑的整个网页的测试代码

<!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"/>
    <meta. http-equiv="X-UA-Compatible" content="IE=7" />
    <title>Maps Toolbar</title>
   <link rel="stylesheet" type="text/css" href="http://lazysheep/arcgis_js_api/library/2.0/arcgis/js/dojo/dijit/themes/tundra/tundra.css">
    <script. type="text/javascript" src="http://lazysheep/arcgis_js_api/library/2.0/arcgis/"></script>
    <script. type="text/javascript">
      dojo.require("esri.map");
      dojo.require("esri.toolbars.draw");
   dojo.require("esri.dijit.editing.Editor-all");
   dojo.require("esri.tasks.geometry");
      dojo.require("esri.geometry");
   
      var map, toolbar, symbol, editLayer,gsvc,gra;
      function init() {
    esri.config.defaults.io.proxyUrl = "proxy.ashx";
        map = new esri.Map("map");
        gsvc = new esri.tasks.GeometryService("http://lazysheep:8399/arcgis/rest/services/Geometry/GeometryServer");
  var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://lazysheep:8399/arcgis/rest/services/world/MapServer");
        map.addLayer(basemap);
  
  
  editLayer = new esri.layers.FeatureLayer("http://lazysheep:8399/arcgis/rest/services/wd/FeatureServer/0", {
          mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
          outFields: ["*"]
        });
  dojo.connect(map, "onLayersAddResult", initEditing);
  dojo.connect(editLayer,"onEditsComplete",addCalled);
        map.addLayers([editLayer]);
  
      }
   
   function addCalled(addResults,updateResults, deleteResults){
    if(addResults[0].success==true){
   alert("success");
  }else{
   alert("faile");
  }
   }


      function createToolbar(map) {
        toolbar = new esri.toolbars.Draw(map);  
        dojo.connect(toolbar, "onDrawEnd", addToMap);
      }

      function addToMap(geometry) {
       switch (geometry.type) {
          case "point":
            var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 1), new dojo.Color([0,255,0,0.25]));
            break;
          case "polyline":
            var symbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([255,0,0]), 1);
            break;
          case "polygon":
            var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25]));
            gsvc.simplify([geometry],doSave);  //对simplify进行监听,在完成simplify操作后重设图形。
   break;
          case "extent":
            var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, 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;
          case "multipoint":
            var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND, 20, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0,0,0]), 1), new dojo.Color([255,255,0,0.5]));
            break;
        }  
        var graphic = new esri.Graphic(geometry, symbol);
  gra = graphic;
        map.graphics.add(graphic);
   }
   
   
   function drawing(){
    toolbar = new esri.toolbars.Draw(map);
  toolbar.activate(esri.toolbars.Draw.POLYGON);
        dojo.connect(toolbar, "onDrawEnd", addToMap);
   }
   
   function drawing2(){
    toolbar = new esri.toolbars.Draw(map);
  toolbar.activate(esri.toolbars.Draw.FREEHAND_POLYGON);
        dojo.connect(toolbar, "onDrawEnd", addToMap);
   }
   
   function initEditing(layers) {
        var myMap = this;      
        var editToolbar = new esri.toolbars.Edit(myMap);
        dojo.connect(editToolbar, "onDeactivate", function(tool,graphic) {
          editLayer.applyEdits(null, [graphic], null);
        });

        var editingEnabled = false;
        dojo.connect(editLayer, "onDblClick", function(evt) {
          dojo.stopEvent(evt);
          if (editingEnabled === false) {
            editingEnabled = true;
            editToolbar.activate(esri.toolbars.Edit.EDIT_VERTICES , evt.graphic);
          } else {
            editToolbar.deactivate();
            editingEnabled = false;
          }
        });
      }
   
  
   function doSave(geometries){
    alert("Ring的数目 = " + geometries[0].rings.length);
       gra.setGeometry(geometries[0]);  
   }
  

   function save(){
  editLayer.applyEdits([gra],null,null);  
   }
      dojo.addOnLoad(init);
    </script>
  </head>
  <body class="tundra">
    <input type="button" value="draw polygon" nclick="drawing()"/>
 <input type="button" value="draw gpolygon" nclick="drawing2()"/>
 <input type="button" value="save" nclick="save()"/>
    <div id="map" style="width:900px; height:600px; border:1px solid #000;"></div>
  </body>
</html> 

 

 

原文链接:http://www.gisall.com/html/47/122747-4195.html

posted @ 2013-04-26 20:01  沉默的猿  阅读(1648)  评论(0编辑  收藏  举报
AmazingCounters.com
给我写信