Creating a label works incorrectly

Hello folks,

I have problems with the display of a label.
The creation works so far, but depending on the viewing angle, some places are illegible because it slips under the ground.

I created 2 label points here:

So you can see that the label “TEST TEST TEST” is not completely legible, at least in the middle.

If I zoom in now, it gets even worse:

If I zoom in even further, then the label has disappeared completely underground.

How can I make it readable in any position and angle and always in the foreground?

The dark red point here is a point with a pixel size of 20 (so that I can see something). Otherwise at 3 or 5 the point also disappears when zooming in and out. As is the case with the labels, I have the same problem with the point

   position: Cesium.Cartesian3({x,y,z}),
   label: {
            text: 'Test TEST TEST',
            scale: 1.0,
            pixelOffset: new Cesium.Cartesian2(-120, 150),
            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
            verticalOrigin: Cesium.VerticalOrigin.TOP,
            font: '32px Helvetica',
            fillColor: Cesium.Color.YELLOW,
            outlineColor: Cesium.Color.BLACK,
            outlineWidth: 130,
            style: Cesium.LabelStyle.FILL_AND_OUTLINE,

Here in the code I played around with the pixelOffset and outlineWidth. But that and the colors there didn’t do anything. As if these properties were not set at all.

I ask for help.

Hi, You can check my this post for similar issue’s solution.

Hi Jacky,

Thanks for your help.

Yes, that worked great.
I was missing the “disableDepthTestDistance: Number.POSITIVE_INFINITY” property.

But I got a problem with the billboard.

Suppose here is my location:

Now without changing the location, I rotate the viewing angle with the mouse, so the billboard icon stays fixed in the middle, but the needle tip no longer shows the point where my location was.

As I have now indicated in the screenshot with the red arrow, it has migrated. What can I do to keep the points / billboards / etc. exactly on the coordinates?

How can I apply the above solution (disableDepthTestDistance: Number.POSITIVE_INFINITY) to polylines and poligons as well?

I must correct myself.

That “disableDepthTestDistance: Number.POSITIVE_INFINITY” worked on Billboard Icon. However, as far as the labels are concerned, it didn’t work


It’s working with Labels also. Example

Wow great that worked. I thank you.
But I had to comment out clampToGround: true as it gave an error.

I have defined a class called Label and am passing the Label as a parameter to the constructor.
Since the Type is: Cesium.LabelGraphics.ConstructorOptions the error is:

(property) clampToGround: boolean
The type "{ show: true; showBackground: true; scale: number; pixelOffset: Cesium.Cartesian2;
eyeOffset: Cesium.Cartesian3; horizontalOrigin: Cesium.HorizontalOrigin.CENTER;
verticalOrigin: Cesium.VerticalOrigin.TOP; ... 7 more . ..; clampToGround: boolean; }" cannot be 
assigned to type "ConstructorOptions".
   The object literal can only specify known properties, and clampToGround does not exist on
the ConstructorOptions type.ts(2322)

You can remove “clampToGround”. I don’t think it will affect the result.

ok thanks for the help…
I have another problem here and would be very happy if you could take a look at it.

Here the link: