|
如何获取绘制结束事件？
|
|
|
下面我们分步向您介绍：
|
 加载地图浏览API
将下载的地图浏览API包解压后拷入网页所在的工程文件夹，将如下列代码所示的相对路径加入网页head节内引用。
|
1.
|
< !--引入地图框架-->
|
|
2.
|
< script src="http://服务器IP/地图API名称/" type="text/javascript" />< /script>
|
创建地图容器元素
创建地图浏览应用程序需要在页面中创建一块区域用于显示地图内容，这个区域我们叫做地图容器，即在body中加入的一个div容器，其页面代码为：
|
1.
|
<div id="map_div" class="content"> </div>
|
参数初始化设置
地图实例通过下列代码创建，其中，DCIMapConfig.mapInitParams是地图初始化参数。
|
1.
|
var map = new DCIMap("map_div", DCIMapConfig.mapInitParams);
|
加载图层到地图
根据底图类型，创建底图，添加到地图中。
|
1.
|
switch (DCIMapConfig.vecMap.type) {
|
|
2.
|
case 0://WMTS
|
|
3.
|
var layers = new DCIWMTSLayer(DCIMapConfig.vecMap.Url);
|
|
4.
|
map.addLayer(layers, 0);
|
|
5.
|
map.showSlider(map.initExtent, DCIMapConfig.sliderConfig);
|
|
6.
|
break;
|
|
7.
|
case 1://1为mapserver切片
|
|
8.
|
var layers = new esri.layers.ArcGISTiledMapServiceLayer(DCIMapConfig.vecMap.Url);
|
|
9.
|
map.addLayer(layers, 0);
|
|
10.
|
dojo.connect(layers, "onLoad", function () {
|
|
11.
|
map.showSlider(map.initExtent, DCIMapConfig.sliderConfig);
|
|
12.
|
})
|
|
13.
|
break;
|
|
14.
|
}
|
|
15.
|
}
|
绑定绘制事件
绑定绘制事件，通过以下定义draw()方法实现
|
1.
|
function draw(evt) {
|
|
2.
|
var tool = null;
|
|
3.
|
switch (evt.id) {
|
|
4.
|
case "point": tool = "POINT"; break;
|
|
5.
|
case "line": tool = "POLYLINE"; break;
|
|
6.
|
case "polygon": tool = "POLYGON"; break;
|
|
7.
|
case "circle": tool = "CIRCLE"; break;
|
|
8.
|
case "rectangle": tool = "RECTANGLE"; break;
|
|
9.
|
case "quxiao": map.drawToolbar.deactivate(); break;
|
|
10.
|
case "remove": map.esriMap.graphics.clear(); break;
|
|
11.
|
}
|
|
12.
|
if (tool !== null) {
|
|
13.
|
map.drawToolbar.activate(esri.toolbars.Draw[tool]);
|
|
14.
|
map.drawToolbar.on("draw-complete", drawEndEvent);
|
|
15.
|
}
|
|
16.
|
}
|
创建按钮
|
1.
|
<input type="button" class="Button" value="点" onclick="draw(this)" id="point">
|
|
2.
|
<input type="button" class="Button" value="线" onclick="draw(this)" id="line">
|
|
3.
|
<input type="button" class="Button" value="面" onclick="draw(this)" id="polygon">
|
|
4.
|
<input type="button" class="Button" value="圆" onclick="draw(this)" id="circle">
|
|
5.
|
<input type="button" class="Button" value="矩形" onclick="draw(this)" id="rectangle">
|
|
6.
|
<input type="button" class="Button" value="取消" onclick="draw(this)" id="quxiao">
|
|
7.
|
<input type="button" class="Button" value="清除" onclick="draw(this)" id="remove">
|
绑定绘制结束事件
绑定绘制结束事件，通过以下定义drawEndEvent()方法实现
|
1.
|
function drawEndEvent(evt) {
|
|
2.
|
var symbol;
|
|
3.
|
if (evt.geometry.type === "point" || evt.geometry.type === "multipoint") {
|
|
4.
|
symbol = map.drawToolbar.markerSymbol;
|
|
5.
|
}
|
|
6.
|
else if (evt.geometry.type === "line" || evt.geometry.type === "polyline") {
|
|
7.
|
symbol = map.drawToolbar.lineSymbol;
|
|
8.
|
}
|
|
9.
|
else {
|
|
10.
|
symbol = map.drawToolbar.fillSymbol;
|
|
11.
|
}
|
|
12.
|
map.esriMap.graphics.add(new esri.Graphic(evt.geometry, symbol));
|
|
13.
|
}
|
|
|
