您的位置：首页 > Web前端 > JavaScript

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

2013-04-26 20:01 369 查看

使用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

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航