android arcgis 绘制圆_Arcgis for js开发之直线、圆、箭头、多边形、集结地等绘制方法...

Arcgis for js开发之直线、圆、箭头、多边形、集结地等绘制方法

将ARCGIS for Js API中绘制各种图形的方法进行封装，方便调用。用时只需要传入参数既可。(在js文件中进行封装定义)；

1、新建js文件，新建空对象用于函数的定义

if (!this["gisTool"]) { gisTool={}; }if (!this["gisTool.Map"]) { gisTool.Map = {}; }

定义一个空对象，用于存储各类方法：

//地图交互事件

gisTool.Map.MapTool = {

在mapTool对中进行新建函数，方便不同功能中的调用。

一、获取当前点击的地图坐标

//地图拾取点坐标

getMapPoint: function(callBack) {

map.setMapCursor("crosshair");var mapHandler = dojo.connect(map, "onClick", function(event) {

clearLayer(map,"PointLayer");try{

map.setMapCursor("default");

callBack(event.mapPoint);

dojo.disconnect(mapHandler);//事件值执行一次

} catch(err) { }

});

},

二、绘制圆形(传入对应的参数既可)

drawCircle: function(x, y, R, symbol, graphicLayer, isFly, callBack) {var ptStart = Geometry.drawPoint(parseFloat(x), parseFloat(y), { wkid: 4832});var circleGeometry = newesri.geometry.Circle(ptStart, {"radius": R,

});if(isFly) {

CenterAt(map, circleGeometry);

}var graphic = newesri.Graphic(circleGeometry, symbol);if (callBack != null) {

callBack(circleGeometry);

}

graphicLayer.add(graphic);

},

三、图形定位(单击进行坐标或者geometry定位)

flayCirle: function(map, geometry) {var extent =geometry.getExtent();if (geometry.type == "point") {

extent= new esri.geometry.Extent(geometry.x - 0.0000001, geometry.y - 0.0000001, geometry.x - 0 + 0.0000001, geometry.y - 0 + 0.0000001, map.spatialReference);

extent= extent.expand(1.5);

}if (extent != null) {var point = new esri.geometry.Point(extent.xmin + (extent.xmax - extent.xmin) / 2, extent.ymin + (extent.ymax - extent.ymin) / 2, map.spatialReference);var newExtent = newesri.geometry.Extent(point.x, point.y, point.x, point.y, point.spatialReference);//如果当前视图包含要缩放视图

if(Extent(map.extent, extent)) {//extent = extent.expand(2);

map.setExtent(extent);

}else{var firstEx =UnionExtent(newExtent, map.extent);

map.setExtent(firstEx,true);

setTimeout(function() {

map.centerAt(point)

},700);

setTimeout(function() {

extent= extent.expand(1.5);

map.setExtent(extent);

},1400);

}

}

},

四、绘制多线段PloygonLine

drawPolyLine: function(callback) {var toolbar = new esri.toolbars.Draw(map, { showTooltips: true});

toolbar.activate(esri.toolbars.Draw.POLYLINE);

dojo.connect(toolbar,"onDrawEnd", function(geometry) {

callback(geometry);

toolbar.deactivate();

});

},

五、将绘制的多线段添加到地图上

addPolyLine: function(points,symbol,graphicLayerName) {var map =map;

require(["esri/geometry/Polygon", "esri/SpatialReference"], function(Polygon, SpatialReference) {var polygonLine = new Polygon(newesri.SpatialReference({ wkid: wkid }));

polygonLine.addRing(points);var graphicsLayer =GrapchicLayer(map, graphicLayerName);var graphic = newesri.Graphic(polygonLine, symbol);

graphicsLayer.add(graphic);

});

},

六、绘制多边形

drawPolygon:function(callback){var toolbar = newesri.toolbars.Draw(map, {

showTooltips:true});

toolbar.activate(esri.toolbars.Draw.POLYGON);

dojo.connect(toolbar,"onDrawEnd", function(geometry) {

callback(geometry);

toolbar.deactivate();

});

},

七、绘制箭头的方法

drawArrow: function(callback) {var toolbar = new esri.toolbars.Draw(map, { showTooltips: true});

toolbar.activate(esri.toolbars.Draw.ARROW);

dojo.connect(toolbar,"onDrawEnd", function(geometry) {

callback(geometry);

toolbar.deactivate();

});

},

八、将多边形添加到地图上

addPolygon: function(points, symbol, graphicLayerName) {var map =map;

require(["esri/geometry/Polygon", "esri/SpatialReference"], function(Polygon, SpatialReference) {var polygon = new Polygon(newesri.SpatialReference({ wkid: 4832}));

polygon.addRing(points);var graphic = newesri.Graphic(polygon, symbol);var graphicsLayer =GraphicLayer(map, graphicLayerName);

graphicsLayer.add(graphic);

});

},

九、画线的方法

drawLine: function(callback) {var toolbar = new esri.toolbars.Draw(map, { showTooltips: true});

toolbar.activate(esri.toolbars.Draw.LINE);

dojo.connect(toolbar,"onDrawEnd", function(geometry) {

callback(geometry);

toolbar.deactivate();

});

},

十、绘制集结地(需要英语第三方的API)

drawGathering_Place: function(pnts,symbol,graphicLayerName) {this.t = 0.4;var mid = P.PlotUtils.mid(pnts[0], pnts[1]);var d = P.PlotUtils.distance(pnts[0], mid) / 0.9;var pnt = P.PlotUtils.getThirdPoint(pnts[0], mid, P.Constants.HALF_PI, d, true);

pnts= [pnts[0], pnt, pnts[1]];var mid = P.PlotUtils.mid(pnts[0], pnts[2]);

pnts.push(mid, pnts[0], pnts[1]);var normals =[];for (var i = 0; i < pnts.length - 2; i++) {var pnt1 =pnts[i];var pnt2 = pnts[i + 1];var pnt3 = pnts[i + 2];var normalPoints = P.PlotUtils.getBisectorNormals(this.t, pnt1, pnt2, pnt3);

normals=normals.concat(normalPoints);

}var count =normals.length;

normals= [normals[count - 1]].concat(normals.slice(0, count - 1));var pList =[];for (i = 0; i < pnts.length - 2; i++) {

pnt1=pnts[i];

pnt2= pnts[i + 1];

pList.push(pnt1);for (var t = 0; t <= P.Constants.FITTING_COUNT; t++) {var pnt = P.PlotUtils.getCubicValue(t / P.Constants.FITTING_COUNT, pnt1, normals[i * 2], normals[i * 2 + 1], pnt2);

pList.push(pnt);

}

pList.push(pnt2);

}

gisTool.MapTool.addPolygon(pList, symbol,graphicLayerName);

},

十一、绘制自由线

drawFreehandLine: function(callback) {var toolbars = new esri.toolbars.Draw(map, { showTooltips: true});

toolbars.activate(esri.toolbars.Draw.FREEHAND_POLYLINE);

dojo.connect(toolbars,"onDrawEnd", function(geometry) {

callback(geometry);

toolbars.deactivate();

});

},

十二、手绘多边形

drawFreePolygon: function(callback) {var toolbars = new esri.toolbars.Draw(map, { showTooltips: true});

toolbars.activate(esri.toolbars.Draw.FREEHAND_POLYGON);

dojo.connect(toolbars,"onDrawEnd", function(geometry) {

callback(geometry);

toolbars.deactivate();

});

},

十三、绘制文字

drawText: function(symbol,graphicLayerName) {var toolbar = new esri.toolbars.Draw(map, { showTooltips: true});

toolbar.activate(esri.toolbars.Draw.POINT);

map.setMapCursor("crosshair");

toolbar.on("draw-complete", function(evt) {var point =evt.geometry;var graphicLayer =GraphicLayer(map, graphicLayerName);var graphic =esri.Graphic(point, symbol);

graphicLayer.add(graphic);

map.setMapCursor("default");

toolbar.deactivate();

});

},

十四、删除图层上的单一要素的方法

deleteOneGraphic: function(graphicLayerName) {var map =map, oneEvent;

map.setMapCursor("crosshair");var graphicLayer = newGraphicLayer(map, graphicLayerName);if(graphicLayer) {

oneEvent= dojo.connect(graphicLayer, "onClick", function(evt) {

map.setMapCursor("default");

graphicLayer.remove(evt.graphic);

dojo.disconnect(oneEvent);

});

}

},

十五、缩放到指定范围

zoomToGeometry: function(xMin, xMax, yMin, yMax) {var wkid =Robin.Setting.GlobalSetting.wkid;//起点、终点

var extent = new esri.geometry.Extent(xMin, yMin, xMax, yMax, newesri.SpatialReference({ wkid: wkid }));

Extent(map, extent.expand(3));

}

关于传入的参数进行说明：

graphicLayerName:为指定的需要操作的图层名称，根据具体的图层名称方便后期的管理。

symbol:线或者面的填充样式，一般的定义样式如下：

var symbol = newesri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID,newesri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,new dojo.Color([255, 0, 0, 0.6]), 4),new dojo.Color([0, 255,0 , 0.6]));

传入的point的值是callback中返回的geometry中解析出的： var point = geometry.rings[0];

说明：总结仅供参考，有意见保留。