有一个数组,每一个数组元素表示一个坐标点,坐标点里面有两种状态查看和未查看,使用Cesium把他们连接起来,未查看的线段为红色,查看的线段为绿色
时间: 2023-12-14 16:37:04 浏览: 53
首先,需要创建一个Cesium的Viewer对象,用来展示场景。然后,根据数组中的坐标点创建对应的Cesium.Cartesian3对象,表示三维坐标点。接着,遍历数组中的每一个点,根据其状态创建对应的线段,并设置颜色。最后,把线段添加到场景中即可。
以下是示例代码:
```javascript
// 创建Cesium Viewer对象
var viewer = new Cesium.Viewer('cesiumContainer');
// 坐标点数组
var points = [
{position: [116.3975, 39.9088], viewed: true},
{position: [116.4074, 39.9042], viewed: false},
{position: [116.418, 39.9042], viewed: false},
{position: [116.418, 39.9139], viewed: true}
];
// 遍历坐标点数组
for (var i = 0; i < points.length - 1; i++) {
var p1 = Cesium.Cartesian3.fromDegrees(points[i].position[0], points[i].position[1]);
var p2 = Cesium.Cartesian3.fromDegrees(points[i+1].position[0], points[i+1].position[1]);
var color = (points[i].viewed && points[i+1].viewed) ? Cesium.Color.GREEN : Cesium.Color.RED;
var line = viewer.entities.add({
polyline: {
positions: [p1, p2],
width: 5,
material: new Cesium.PolylineOutlineMaterialProperty({
color: color,
outlineWidth: 2,
outlineColor: Cesium.Color.BLACK
})
}
});
}
```
上述代码中,我们使用Cesium.Cartesian3.fromDegrees方法将经纬度转换为Cartesian3坐标。然后,根据每个点的状态设置线段颜色,使用Cesium.PolylineOutlineMaterialProperty创建线段材质,并添加到场景中。
阅读全文