Arcgis for js开发之直线、圆、箭头、多边形、集结地等绘制方法
将ARCGIS for Js API中绘制各种图形的方法进行封装，方便调用。用时只需要传入参数既可。（在js文件中进行封装定义）；
1、新建js文件，新建空对象用于函数的定义
if (!this["gisTool"]) { gisTool= {}; }if (!this["gisTool.Map"]) { gisTool.Map = {}; } 定义一个空对象，用于存储各类方法：
//地图交互事件gisTool.Map.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 = new esri.geometry.Circle(ptStart, { "radius": R, }); if (isFly) { CenterAt(map, circleGeometry); } var graphic = new esri.Graphic(circleGeometry, symbol); if (callBack != null) { callBack(circleGeometry); } graphicLayer.add(graphic); }, 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 = new esri.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(new esri.SpatialReference({ wkid: wkid })); polygonLine.addRing(points); var graphicsLayer = GrapchicLayer(map, graphicLayerName); var graphic = new esri.Graphic(polygonLine, symbol); graphicsLayer.add(graphic); }); }, 六、绘制多边形
drawPolygon:function(callback){ var toolbar = new esri.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(new esri.SpatialReference({ wkid: 4832})); polygon.addRing(points); var graphic = new esri.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 = new GraphicLayer(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, new esri.SpatialReference({ wkid: wkid })); Extent(map, extent.expand(3)); }
关于传入的参数进行说明：
graphicLayerName:为指定的需要操作的图层名称，根据具体的图层名称方便后期的管理。
symbol:线或者面的填充样式，一般的定义样式如下：
var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.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];
说明：总结仅供参考，有意见保留。