我寫的這個點線面繪制融入了增刪改的功能。
其中可以通過手動點擊地圖進行動態繪制線面,也支持通過給定坐標數組來進行線面的增加。
繪制好的線面,可以點擊進行修改;
以上介紹了我的大概的要給操作,下面以面的構建來進行代碼解釋;
cesium中想動態構建線面,離不開的一個屬性就是CallbackProperty。
以下是部分核心代碼:
1、構建面核心代碼
此處面的postions用了callbackproperty,就可以進行動態繪制了,關於property的講解可以參閱:https://www.jianshu.com/p/f0b47997224c
createPolygon: function(obj) { var $this = this; return this.viewer.entities.add({ polygon: { hierarchy: new Cesium.CallbackProperty(function() { return $this.positions }, false), clampToGround: obj.clampToGround || true, show: true, fill: obj.fill || true, material: obj.material || Cesium.Color.WHITE, width: obj.width || 3, outlineColor: obj.outlineColor || Cesium.Color.BLACK, outlineWidth: obj.outlineWidth || 1, outline: false || obj.outline } }); },
2、操作邏輯核心代碼
大致解釋以下操作邏輯:
首先是綁定了鼠標左擊,當鼠標在地圖上點擊時,會保存點擊的坐標,用於構建面。鼠標移動時,會動態顯示面;
鼠標右擊時結束操作;
更多詳情見下面鏈接文章:
文章提供源碼,對本專欄感興趣的話,可以關注一波