cesium添加面plane不显示
时间: 2024-01-02 15:02:31 浏览: 34
如果您在Cesium中添加了一个面(plane),但它没有显示出来,可能有以下几个原因:
1. 您设置了面的位置,但它可能被放置在地球的内部或者视线之外,导致它无法被看到。您可以尝试更改面的位置或者缩小视野范围来查看它是否出现。
2. 您没有正确设置面的材质(material)。请确保您使用了合适的材质,如ColorMaterialProperty或ImageMaterialProperty,并正确设置了材质的属性。
3. 您没有正确设置面的法线(normal)。请确保您设置了正确的法线,以便正确计算面的位置和方向。
4. 您没有正确设置面的顶点(vertex)。请确保您设置了正确的顶点坐标,以便正确渲染面。
如果您仍然无法找到问题,请检查您的代码,确保您正确地添加了面,并使用正确的属性和方法来设置面的位置、材质、法线和顶点。
相关问题
cesium 面贴地plane
好的,你想了解关于 Cesium 中实现面贴地的 plane 的内容。在 Cesium 中,面贴地的 plane 可以通过创建一个 GeometryInstance 对象和一个 Primitive 对象来实现。GeometryInstance 对象描述了面贴地的 plane 的几何形状,而 Primitive 对象则定义了如何渲染这个 GeometryInstance 对象。
具体实现过程如下:
1. 创建一个 PlaneGeometry 对象,该对象表示一个无限平面。
```
var planeGeometry = new Cesium.PlaneGeometry({
vertexFormat: Cesium.VertexFormat.POSITION_ONLY,
});
```
2. 创建一个 PlaneGeometryInstance 对象,该对象描述了要面贴地的 plane 的位置、方向和大小等属性。在这里,我们使用 Cesium.Cartesian3.fromDegrees() 方法将经纬度坐标转换为笛卡尔坐标。
```
var planeGeometryInstance = new Cesium.GeometryInstance({
geometry: planeGeometry,
modelMatrix: Cesium.Matrix4.multiplyByTranslation(
Cesium.Transforms.eastNorthUpToFixedFrame(
Cesium.Cartesian3.fromDegrees(lon, lat, height)
),
new Cesium.Cartesian3(0.0, 0.0, 0.0),
new Cesium.Matrix4()
),
});
```
3. 创建一个 Material 对象,该对象定义了面贴地的 plane 的外观样式,例如颜色、透明度等。
```
var planeMaterial = Cesium.Material.fromType("Color");
planeMaterial.uniforms.color = new Cesium.Color(1.0, 1.0, 1.0, 0.5);
```
4. 创建一个 Primitive 对象,该对象是最终的渲染对象,将 GeometryInstance 对象和 Material 对象结合起来,显示在场景中。
```
var planePrimitive = new Cesium.Primitive({
geometryInstances: planeGeometryInstance,
appearance: new Cesium.MaterialAppearance({
material: planeMaterial,
faceForward: true,
translucent: true,
}),
});
```
以上就是在 Cesium 中实现面贴地的 plane 的基本流程。
cesium如何让面plane贴地且紧贴地形
要让面(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)贴地且紧贴地形的效果。
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)