cesium 实现动态标绘_cesium1.65api版本贴地贴模型标绘工具效果(附源码下载)

67722cf9433fe448136a15b0670cd864.png

前言

cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材。

内容概览

1.cesium1.65api版本贴地贴模型标绘工具效果
2.源代码demo下载

效果图如下:

ab5be619e9596986169b907892d49aee.png

c51c3822dfb843e156a083054e958c9f.png
实现思路:
鼠标左键Cesium.ScreenSpaceEventType.LEFT_CLICK
鼠标移动Cesium.ScreenSpaceEventType.MOUSE_MOVE
鼠标右键Cesium.ScreenSpaceEventType.RIGHT_CLICK
鼠标左键事件,获取点击地图的每个坐标点;鼠标移动事件,动态扑捉鼠标移动状态,下一个坐标点位置;鼠标右键意味着标绘结束状态。
  • 定义封装DrawTool标绘工具:
var DrawTool = function (obj) { 
 if (!obj.viewer || !obj) { 
 console.warn("缺少必要参数!--viewer"); 
 return; 
    } 
 this.viewer = obj.viewer;
以下是使用Cesium API中的MilitaryPlotting扩展实现军事的代码示例: ```javascript var viewer = new Cesium.Viewer('cesiumContainer'); // 添加MilitaryPlotting扩展 viewer.extend(Cesium.MilitaryPlotting); // 创建一个对象 var entity = viewer.entities.add({ position: Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883), polyline: { positions: Cesium.Cartesian3.fromDegreesArrayHeights([ -75.59777, 40.03883, 0, -75.59777, 40.13883, 0, -75.69777, 40.13883, 0, -75.69777, 40.03883, 0, -75.59777, 40.03883, 0 ]), width: 5, material: new Cesium.PolylineDashMaterialProperty({ color: Cesium.Color.fromCssColorString('#FF0000').withAlpha(0.7) }) }, // 添加军事图形 military: { symbolCode: 'GFGPGLB----K---', // 任务图形代码 fillMaterial: new Cesium.ColorMaterialProperty( Cesium.Color.fromCssColorString('#FF0000').withAlpha(0.3) ), outlineColor: new Cesium.ColorMaterialProperty( Cesium.Color.fromCssColorString('#FF0000').withAlpha(0.7) ), // 边界线颜色 size: 50, // 图形大小 rotation: Cesium.Math.toRadians(45) // 旋转角度 } }); // 调整相机视角 viewer.zoomTo(entity); ``` 在上述代码中,我们首先创建了一个Cesium Viewer对象,并添加了MilitaryPlotting扩展。然后,我们创建了一个实体对象,并在其中添加了一个Polyline对象作为参考线,以及一个MilitaryPlotting对象作为军事图形。最后,我们调用zoomTo函数调整相机视角,以便能够完整地显示图形。 需要注意的是,上述代码仅仅是演示了如何使用MilitaryPlotting扩展进行军事,实际应用中需要根据具体需求进行调整和扩展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值