点标记鼠标绘制工具

1.构造方法：

const markerDrawer = new MchCesium.MakerDrawer(id, billboardGraphics, labelGraphics)

2.参数说明

id(String) 鼠标绘制工具id

billboardGraphics(Object)：点标记的图标配置。具体配置参考http://cesium.xin/cesium/cn/Documentation1.62/BillboardGraphics.html

labelGraphics(Object)：点标记的label配置。具体配置参考http://cesium.xin/cesium/cn/Documentation1.62/LabelGraphics.html

option(Object)：非必填。包含如下属性： needTrans(Boolean)：是否需要gcj转wgs84; editable(Boolean)：点标记是否可编辑; extData(Object) 自定义数据; label(Object)：可选，如果点标记想带Label，则设置此项，具体配置参考如下链接： http://cesium.xin/cesium/cn/Documentation1.62/LabelGraphics.html

3.开启鼠标绘制点标记功能open()

markerDrawer.open()

4.关闭鼠标绘制点标记功能close()

markerDrawer.close()

5.监听鼠标绘制点结束事件，并传入回调。onFinish(callback)

参数说明：callback 回调函数，回调函数的参数

markerDrawer.onFinish(function (e) { console.log(e) })

6.完整代码示例

<div id="cesiumContainer"></div>   <div class="btnbar">     <button id="open">开启鼠标绘制</button>     <button id="close">关闭鼠标绘制</button>   </div>   <script type="text/javascript">     const view3D = MchCesium.init('cesiumContainer', true)     let billboardGraphics = {       image: './mhc/img/st_uav.png',       width:50,       height: 35,       verticalOrigin: Cesium.VerticalOrigin.BOTTOM,       horizontalOrigin: Cesium.HorizontalOrigin.CENTER,       heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,     }     let labelGraphics = {       text: '这是marker的label',       font: '14px Microsoft YaHei',       verticalOrigin: Cesium.VerticalOrigin.BOTTOM,       pixelOffset: new Cesium.Cartesian2(0, -40)     } let option = {needTrans: true}     const markerDrawer = new MchCesium.MarkerDrawer('testMarkerDrawer', billboardGraphics, labelGraphics, option)     document.getElementById('open').onclick = function () {       markerDrawer.open()     }       document.getElementById('close').onclick = function () {       markerDrawer.close()     }     markerDrawer.onFinish(function(e) {       console.log('当前绘制的点标记', e);     })   </script>

7.展示效果

Demo地址：

https://mhc.ixiera.com/html/cesiumDemo/demo_markerDrawer.html