Billboard ordering incorrect when using disableDepthTestDistance
- Dominant language
- JavaScript
- Stars
- 15.7k
- Forks
- 3.9k
- Avg merge
- 4d 6h
- Merged PRs (30d)
- 34
Description
When the `disableDepthTestDistance` is greater than the distance from the camera to the billboard, the wrong billboard renders on top. In this example, the blue billboard has a greater height than the red billboard so it should be visible. However, the red billboard is instead.
```js
var viewer = new Cesium.Viewer('cesiumContainer');
var scene = viewer.scene;
var camera = scene.camera;
var billboards = scene.primitives.add(new Cesium.BillboardCollection());
billboards.add({
image : '../images/Cesium_Logo_overlay.png',
color: Cesium.Color.RED,
position : Cesium.Cartesian3.fromDegrees(0, 0),
disableDepthTestDistance: Number.POSITIVE_INFINITY
});
billboards.add({
image : '../images/Cesium_Logo_overlay.png',
color: Cesium.Color.BLUE,
position : Cesium.Cartesian3.fromDegrees(0, 0, 100),
disableDepthTestDistance: Number.POSITIVE_INFINITY
});
camera.position = Cesium.Cartesian3.fromDegrees(0, 0, 4000);
camera.direction = Cesium.Cartesian3.negate(Cesium.Cartesian3.UNIT_X, new Cesium.Cartesian3());
camera.up = Cesium.Cartesian3.clone(Cesium.Cartesian3.UNIT_Z);
```
Contributor guide
Research direction
Start by running the inline JavaScript reproduction with two Cesium billboards at different heights and infinite disableDepthTestDistance. Trace the billboard rendering and depth-test behavior involved in that case; done means the blue billboard renders on top of the red one as described.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- computer-graphics
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100