所以我的思路如下：
- 使用arcgis javascript api 的Draw工具（ esri/toolbars/draw ），主要功能是繪制出點(diǎn)線(xiàn)面。
- 然后再計(jì)算繪制出來(lái)的圖形，這里需要使用geometryEngine（ esri/geometry/geometryEngine 3.13才添加的新工具 ），主要功能是計(jì)算對(duì)應(yīng)的圖形長(zhǎng)度面積等。這里也可以使用arcgis server里面的服務(wù)來(lái)代替。
下面說(shuō)下實(shí)現(xiàn)的步驟：
-
使用Draw工具繪制圖形（官網(wǎng)實(shí)例代碼）。
new出draw工具--->定義繪制完成的回調(diào)函數(shù)--->在對(duì)應(yīng)地方添加觸發(fā)繪制的事件
- 引入對(duì)應(yīng)的draw esri/toolbars/draw ，定義draw工具
var draw = new Draw(map);- 定義繪制完成的回調(diào)函數(shù)
var draw = new Draw(map); /** on(type: "draw-complete", listener: (event: { geometry: Geometry; target: Draw }) => void): esri.Handle; 回調(diào)函數(shù)的參數(shù)有：繪制完成圖形的對(duì)應(yīng)的地理信息：geometry，以及整個(gè)draw對(duì)象。 */ draw.on("draw-complete",endDraw) function endDraw(event){ //邏輯處理 }- 在對(duì)應(yīng)的dom觸發(fā)對(duì)應(yīng)的圖形繪制，下面舉例繪制點(diǎn)的例子。
var draw = new Draw(map); /** on(type: "draw-complete", listener: (event: { geometry: Geometry; target: Draw }) => void): esri.Handle; 回調(diào)函數(shù)的參數(shù)有：繪制完成圖形的對(duì)應(yīng)的地理信息：geometry，以及整個(gè)draw對(duì)象。 */ draw.on("draw-complete",endDraw) function endDraw(event){ //邏輯處理 } var ptDom = document.getElementById("ptDom") ptDom.addEventListener("click", drawPoint, false); function drawPoint(){ this.draw.activate(Draw.POINT); }下面分別是開(kāi)啟繪制對(duì)應(yīng)圖形的代碼，以及取消繪制，可以在對(duì)應(yīng)的dom事件添加：
function drawCircle(){//繪制圓 this.draw.activate(Draw.CIRCLE); } function drawPolygon(){//繪制多邊形 this.draw.activate(Draw.POLYGON); } function drawPolyline(){//繪制線(xiàn) this.draw.activate(Draw.POLYLINE); } function endDraw(){ this.draw.deactivate(); } -
測(cè)距、測(cè)面積的工具實(shí)現(xiàn)。引入工具geometryEngine esri/geometry/geometryEngine工具，這里需要在繪制完成的回調(diào)參數(shù)里面判斷繪制的圖形類(lèi)型，然后再做對(duì)應(yīng)處理。下面關(guān)注 endDraw 函數(shù)即可。
function endDraw(event){ //邏輯處理 var result = null; switch (event.geometry.type) { case "point": break; case "polyline": //使用geodesicLength計(jì)算長(zhǎng)度 result = GeometryEngine.geodesicLength(event.geometry,"kilometers"); break; case "polygon": //使用geodesicArea計(jì)算面積 result = GeometryEngine.geodesicArea(event.geometry,"kilometers"); break; default: break; } }上面就能得到你需要的結(jié)果，然后再你想要的地方顯示出來(lái)就可以了。
-
緩沖區(qū)分析工具實(shí)現(xiàn)。我們繼續(xù)在回調(diào)函數(shù) endDraw 處理。緩沖區(qū)分析，主要就是在繪制的范圍內(nèi)，篩選出該范圍內(nèi)的圖形。主要是針對(duì)各種圖層服務(wù)來(lái)做對(duì)應(yīng)的處理。下面主要介紹：FeatureServer、以及featureCollection構(gòu)建的FeatureLayer圖層。
... var layer //這里是你的各種圖層 ... function endDraw(event){ switch (event.geometry.type) { case "polygon": //只有是多邊形的才進(jìn)行處理 switch (layer.type) { case "Feature Layer": if(layer.url){//如果是基于arcgis server的服務(wù)的FeatureLayer /* 引入"esri/tasks/query"，可以直接調(diào)用服務(wù)的查詢(xún)，非常方便 */ var query = new Query(); query.geometry = event.geometry; query.outFields = ["OBJECTID"]; var queryTask = new QueryTask(layer.layer.url); var queryTask.execute(query, (results: any) => { //results就是在繪制范圍內(nèi)的要素。 }); }else{//如果是基于featureCollection構(gòu)建的FeatureLayer } break; default: break; } break; default: break; } }
.......未完不續(xù)。。。
