cesium中小车沿路径动态运行

这次做了一个cesium中小车沿路径动态运行的小代码。
需要的数据就是小车glb模型(cesium有自带),多个路径的点坐标(经纬度即可)

中间出现了几个问题值得记录。

1.首先是czml中坐标的问题。

czml中的position官方解释是:Defines a position. The position can optionally vary over time.
其中位置坐标有很多可选的形式,分别是cartesian ,cartographicRadians,cartographicDegrees,cartesianVelocity。也就是说,position的坐标只支持这些方式。
在这里插入图片描述
在这里插入图片描述
网址
这里是网址:https://github.com/AnalyticalGraphicsInc/czml-writer/wiki/Position

2.由于小车路径是在有地形的时候运行,所以这个路径就需要高度信息,cesium中有自带的检测地形高度方法。sampleTerrainMostDetailed(terrainProvider, positions)。

在这里插入图片描述
可以看到,sampleTerrainMostDetailed(terrainProvider, positions)中的positions要求是 Array.,所以给定的位置数据必须要转换成Cartographic。
这里就有必要说一下两个易混的经纬度,CartographicRadiansValue,CartographicDegreesValue。

CartographicRadiansValue:是根据弧度指定的坐标。WGS84大地测量位置,指定为[Longitude, Latitude, Height],其中经度和纬度以弧度表示,高度以米为单位。

CartographicDegreesValue:是根据度指定的坐标。WGS84大地测量位置,指定为[Longitude, Latitude, Height],其中经度和纬度以度为单位,高度以米为单位。

我的代码中先用 Cesium.Cartographic.fromDegrees(103.667886, 32.051531) 把数据转换成Cartographic。要注意转换后对象的值将以弧度为单位!!!
这个地方稍有不注意就会犯错,导致线路加载不出来。

然后通过Cesium.sampleTerrainMostDetailed(terrainProvider, positions);得到指定经纬度的高度信息,然后加载到czml里即可。

3.是异步编程问题。
js中的异步编程,通俗的解释一下就是从主线程发射一个子线程来完成任务。异步编程有回调函数,但是回调函数有些不好用的地方,所以大多都是用promise。这种“承诺将来会执行”的对象在JavaScript中称为Promise对象。本代码中的Cesium.when(promise, function (updatedPositions) {}需要异步调用完成之后才能加载到czml中,updatedPositions就是var promise = Cesium.sampleTerrainMostDetailed(terrainProvider, positions);所返回的值。

4.最后就是小车的方向问题Orientation。小车模型的方向需要进行制定,不然朝向与线路是堆不起来的。

 viewer.dataSources.add(dataSource).then(function(ds){
                var s = ds.entities.getById("CesiumMilkTruck");
                s.orientation =new Cesium.VelocityOrientationProperty(s.position);

            });

通过这个代码引入czml并且为小车实体添加VelocityOrientationProperty方法使其自动定向。
至此,这个功能已经完整的实现了,现在在较平坦的地方走的话效果会比较好,如果在山路中走效果还是有待商榷,下面这几天我主要研究一下如何在山路中使其效果变好。

源码发在github上了 ,有需要的可以自取哈。

https://github.com/mst272/dynamic-vehicle-in-cesium

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值