超圖WebGL三維接口中有一個繪製的接口(new Cesium.DrawHandler(viewer, mode, clampMode),它封裝了繪製完以後的式樣,畫完以後捕捉繪製完成的實體有必定的難度,並且樣子也改不了,因此我對其Drawhandler的方法作了變形,只使用其繪製中的預覽效果,最終畫完的東西按咱們本身的來,咱們只抓取繪製的點。html
原理是使用Drawhandler的 drawEvt,繪製完成事件的回調post
handler.drawEvt.addEventListener(function(result){ console.log(result); });
下面是改裝:spa
let draw = new Cesium.DrawHandler(_view.view, mode, _clampMode||Cesium.ClampMode.Space); draw.activate(); let style; if(!_style){ style={}; }else{ style=_style; } draw.drawEvt.addEventListener(function(result){ let DRAWENTITY; switch (mode) { case Cesium.DrawMode.Polygon:case 'Cesium.DrawMode.Polygon':case '2':case 2: style.polygon.hierarchy=result.object.polygon.hierarchy; _view.view.entities.remove(result.object); draw.clear(); DRAWENTITY= _view.view.entities.add({ id:entityProperty.id||null, description:entityProperty.description||null, name:entityProperty.name||'', show:entityProperty.show||true, polygon:style.polygon }); break; case Cesium.DrawMode.Point:case 'Cesium.DrawMode.Point':case '0':case 0: let pointPosition = result.object.position; _view.view.entities.remove(result.object); draw.clear(); DRAWENTITY=_view.view.entities.add({ id:entityProperty.id||null, description:entityProperty.description||null, name:entityProperty.name||'', show:entityProperty.show||true, position:pointPosition, point:style.point }); break; case Cesium.DrawMode.Line:case 'Cesium.DrawMode.Line':case '1':case 1: let lineStyle = style; lineStyle.polyline.positions= result.object.positions; _view.view.entities.remove(result.object); draw.clear(); DRAWENTITY=_view.view.entities.add({ id:entityProperty.id||null, description:entityProperty.description||null, name:entityProperty.name||'', show:entityProperty.show||true, polyline:lineStyle.polyline }); break; case Cesium.DrawMode.Marker:case 'Cesium.DrawMode.Marker':case '3':case 3: if(style.billboard) { let markerPosition = result.object.position; _view.view.entities.remove(result.object); draw.clear(); DRAWENTITY=_view.view.entities.add({ id:entityProperty.id||null, description:entityProperty.description||null, name:entityProperty.name||'', show:entityProperty.show||true, position:markerPosition, billboard:style.billboard }); }else{ DRAWENTITY=result.object } break; } if(_drawEndcallback){ _drawEndcallback(DRAWENTITY) } draw.deactivate(); });
這樣就能夠在回調中抓取到繪製的實體,固然,若是不想依賴於超圖的接口,由於在繪製過程當中預覽效果用的是綠色的線,很差看。也能夠基於純Cesium本身寫一個,我寫的基於原始Cesium的繪製方法在下面這個連接裏:code