cesium如何让面plane贴地且紧贴地形
时间: 2023-07-05 21:16:06 浏览: 175
要让面(plane)贴地且紧贴地形,您可以使用Cesium中的Primitive API和GroundPrimitive API。这两个API都可以用于在地球表面上绘制图形,但它们的实现方式略有不同。
以下是使用Primitive API实现面贴地的步骤:
1. 创建一个Primitive对象,并将其添加到场景中:
```javascript
var primitive = new Cesium.Primitive({
geometryInstances: new Cesium.GeometryInstance({
geometry: new Cesium.PlaneGeometry({
vertexFormat: Cesium.VertexFormat.POSITION_ONLY
}),
modelMatrix: Cesium.Matrix4.IDENTITY
}),
appearance: new Cesium.MaterialAppearance({
material: Cesium.Material.fromType('Color', {
color: Cesium.Color.RED
})
})
});
viewer.scene.primitives.add(primitive);
```
2. 使用Cesium.sampleTerrainMostDetailed函数获取地形高度,并将面的高度设置为地形高度:
```javascript
var positions = Cesium.Cartesian3.fromDegreesArray([lon1, lat1, lon2, lat2, lon3, lat3, lon4, lat4]);
Cesium.sampleTerrainMostDetailed(viewer.terrainProvider, positions).then(function() {
var minHeight = Math.min(positions[0].height, positions[2].height, positions[4].height, positions[6].height);
var modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(positions[0], Cesium.Ellipsoid.WGS84);
Cesium.Matrix4.multiplyByTranslation(modelMatrix, new Cesium.Cartesian3(0.0, 0.0, minHeight), modelMatrix);
primitive.geometryInstances.geometry = new Cesium.PlaneGeometry({
vertexFormat: Cesium.VertexFormat.POSITION_ONLY,
plane: new Cesium.Plane(Cesium.Cartesian3.UNIT_Z, minHeight)
});
primitive.geometryInstances.modelMatrix = modelMatrix;
});
```
这个例子中,我们使用了一个PlaneGeometry来创建一个平面,并使用sampleTerrainMostDetailed函数获取了顶点的高度,然后将这个高度作为面的高度。最后,我们将这个面的几何实例的模型矩阵设置为一个东北天坐标系到固定坐标系的转换矩阵,并加上地形高度的偏移量。
以下是使用GroundPrimitive API实现面贴地的步骤:
1. 创建一个GroundPrimitive对象,并将其添加到场景中:
```javascript
var primitive = new Cesium.GroundPrimitive({
geometryInstances: new Cesium.GeometryInstance({
geometry: new Cesium.PlaneGeometry({
vertexFormat: Cesium.VertexFormat.POSITION_ONLY
})
}),
appearance: new Cesium.MaterialAppearance({
material: Cesium.Material.fromType('Color', {
color: Cesium.Color.RED
})
})
});
viewer.scene.primitives.add(primitive);
```
2. 设置面的顶点坐标和高度,然后调用primitive.update方法更新几何实例:
```javascript
var positions = Cesium.Cartesian3.fromDegreesArray([lon1, lat1, lon2, lat2, lon3, lat3, lon4, lat4]);
Cesium.sampleTerrainMostDetailed(viewer.terrainProvider, positions).then(function() {
var minHeight = Math.min(positions[0].height, positions[2].height, positions[4].height, positions[6].height);
var vertices = [
positions[0].x, positions[0].y, minHeight,
positions[1].x, positions[1].y, minHeight,
positions[2].x, positions[2].y, minHeight,
positions[3].x, positions[3].y, minHeight,
positions[4].x, positions[4].y, minHeight,
positions[5].x, positions[5].y, minHeight,
positions[6].x, positions[6].y, minHeight,
positions[7].x, positions[7].y, minHeight
];
primitive.geometryInstances.geometry.attributes.position.values = new Float32Array(vertices);
primitive.update();
});
```
这个例子中,我们首先使用sampleTerrainMostDetailed函数获取了顶点的高度,并将这个高度作为面的高度。然后,我们将面的顶点坐标设置为经纬度坐标和高度,并使用primitive.update方法更新几何实例。
无论您使用哪种方法,都可以实现面(plane)贴地且紧贴地形的效果。