How to always render a polyline and its label (billboard) together on top, with the label in front of the polyline

CesiumJS
1

I am representing an object using a combination of a polyline and a billboard entity, where the billboard acts as a label positioned on the line.

Requirement

My requirement is:

  • The label (billboard) must be rendered in front of the polyline

  • The entire object (polyline + label) must be rendered on top of all other objects in the scene

Current Implementation

To disable depth testing, I am currently using the following settings:

  • For the polyline primitive:
renderState: {
    depthTest: {
        enable: false
    }
}
  • For the billboard entity:
disableDepthTestDistance: Number.POSITIVE_INFINITY

Problem

With this implementation:

  • The polyline is rendered on top as expected

  • However, the billboard (label) is rendered behind the polyline

As a result, I cannot satisfy the requirement that the label should appear in front of the polyline, while also keeping the entire object always rendered on top of other scene elements.

Question

  • Is there a way to render a polyline and its billboard together as a single object, such that:

    • the billboard is always rendered in front of the polyline, and

    • the whole object is always rendered on top of all other entities?

  • Alternatively, is there a more appropriate approach (for example, using different primitives or render order control) to achieve this behavior?

Any guidance would be appreciated.

2

Hi @FC-Tsukada,

I’m not entirely sure that’s possible, currently. I know polylines have zIndex, but generally speaking - billboards / entities have not and it’s been an issue for a long time. It’s been on my mind a lot recently, but hasn’t been given priority. We always welcome contributions of course, if it’s something you’d like to look into (I’d be happy to give pointers if so).

If you link a sandcastle with your current approach, I’ll take a look and see if I can figure out a way to order things the way you’re looking for.

Best,
Matt