When we add a label to Polygon with extrudedHeight set, the label's style will be affected

When we add a label to Polygon with extrudedHeight set, the label’s style will be affected.

Here’s my code

var viewer = new Cesium.Viewer("cesiumContainer");

var redPolygon = viewer.entities.add({
  name: "Red polygon on surface",
  polygon: {
    hierarchy: Cesium.Cartesian3.fromDegreesArray([-115.0,37.0,-115.0,32.0,-107.0,33.0,-102.0,31.0,-102.0,35.0, ]),
    material: new Cesium.ColorMaterialProperty(Cesium.Color.fromCssColorString('#1b2876').withAlpha(0.6)),
  },
});
var polyPositions = redPolygon.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions;
var polyCenter = Cesium.BoundingSphere.fromPoints(polyPositions).center;//中心点
polyCenter = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(polyCenter);
redPolygon.position = polyCenter;
redPolygon.polygon.extrudedHeight = new Cesium.ConstantProperty(10000.0);
redPolygon.label={
    // position:
    text:'Red polygon on surface',
    color : Cesium.Color.fromCssColorString('#fff'),
    font:'normal 32px MicroSoft YaHei',
    scale : 0.5,
  
    horizontalOrigin : Cesium.HorizontalOrigin.LEFT_CLICK,
    heightReference:Cesium.HeightReference.RELATIVE_TO_GROUND,
    verticalOrigin : Cesium.VerticalOrigin.BASELINE,
    disableDepthTestDistance : 10000.0,
    //distanceDisplayCondition:new Cesium.DistanceDisplayCondition(10.0, 20000.0)
};

viewer.zoomTo(viewer.entities);

This is the effect

The text should be white, but it is affected by polygon’s texture

sandcastle

Hi there,

This looks similar to Translucency issues with label on top of billboard · Issue #9681 · CesiumGS/cesium · GitHub. I wonder if the issue is not restricted to billboards, but rather translucent object rendering in general.

I’ll add your report to that issue as well.

Thank you for your response, however, I believe this issue is of a different nature. If the polygon.extrudedHeight property is not set, the desired effect remains unaffected.

I think the bug is occurring for similar reasons which are described more in-depth in Separate pass for billboards · Issue #8810 · CesiumGS/cesium · GitHub.

As a workaround, you can set orderIndependentTranslucency to false and then specify an eyeOffset for the label.

var viewer = new Cesium.Viewer("cesiumContainer", {
 orderIndependentTranslucency: false,
});
redPolygon.label = {
    ...
    eyeOffset: new Cesium.Cartesian3(0.0, 0.0, -800000.0)
};

Sandcastle