CesiumGS / CesiumGS/cesium

Billboard ordering incorrect when using disableDepthTestDistance

Open
#6,838 1 comment 0 reactions 0 assignees View on GitHub
category - billboards type - bug
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

Open the contributing 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.