After adding the transparent background color to label, the bottom map is displayed.

CesiumJS
1

1. A concise explanation of the problem you're experiencing.
After adding the transparent background color to label, the bottom map is displayed, and the middle entity can not be seen. How can I solve it?

2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

4. The Cesium version you're using, your operating system and browser.

2

I’m not sure exactly what you mean here, can you create a Sandcastle example to show what the issue is?

Thanks,

Gabby

3

在 2018年5月2日星期三 UTC+8上午12:39:16，Gabby Getz写道：

I'm not sure exactly what you mean here, can you create a Sandcastle example to show what the issue is?

Thanks,
Gabby

On Saturday, April 28, 2018 at 3:09:03 AM UTC-4, think.h...@gmail.com wrote:1. A concise explanation of the problem you're experiencing.
After adding the transparent background color to label, the bottom map is displayed, and the middle entity can not be seen. How can I solve it?

2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

4. The Cesium version you're using, your operating system and browser.

        var ellipse = viewer.entities.add({
            name: 'ellipse',
            position: Cesium.Cartesian3.fromDegrees(-116.3333, 39.66666, 0),
            ellipse: {
                semiMinorAxis: 200000,
                semiMajorAxis: 200000,
                height: 0,
                material: Cesium.Color.RED,
            }
        });
        var label = viewer.entities.add({
            name: 'label',
            id: 'label',
            position: Cesium.Cartesian3.fromDegrees(-116.33555, 39.66777, 0),
            label: {
                text: "this is a label",
                font: '25pt monospace',
                style: Cesium.LabelStyle.FILL_AND_OUTLINE,
                outlineWidth: 2,
                verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                pixelOffset: new Cesium.Cartesian2(0, 0),
                backgroundColor: Cesium.Color.BLACK.withAlpha(0.5),
                showBackground: true,
                //translucencyByDistance: new Cesium.NearFarScalar(10000, 1.0, 800000, 0.0),
                show:true,
            }
        });

The part of the ellipse below label becomes transparent.

4

Remove the showBackground option form your label.

var label = viewer.entities.add({

name: ‘label’,

id: ‘label’,

position: Cesium.Cartesian3.fromDegrees(-116.33555, 39.66777, 0),

label: {

text: “this is a label”,

font: ‘25pt monospace’,

style: Cesium.LabelStyle.FILL_AND_OUTLINE,

outlineWidth: 2,

verticalOrigin: Cesium.VerticalOrigin.BOTTOM,

pixelOffset: new Cesium.Cartesian2(0, 0),

backgroundColor: Cesium.Color.BLACK.withAlpha(0.5),

//showBackground: true,

//translucencyByDistance: new Cesium.NearFarScalar(10000, 1.0, 800000, 0.0),

show:true,

}

});

``

5

在 2018年5月3日星期四 UTC+8下午10:00:00，Gabby Getz写道：

Remove the showBackground option form your label.

    var label = viewer\.entities\.add\(\{ 
        name: 'label', 
        id: 'label', 
        position: Cesium\.Cartesian3\.fromDegrees\(\-116\.33555, 39\.66777, 0\), 
        label: \{ 
            text: "this is a label", 
            font: '25pt monospace', 
            style: Cesium\.LabelStyle\.FILL\_AND\_OUTLINE, 
            outlineWidth: 2, 
            verticalOrigin: Cesium\.VerticalOrigin\.BOTTOM, 
            pixelOffset: new Cesium\.Cartesian2\(0, 0\), 
            backgroundColor: Cesium\.Color\.BLACK\.withAlpha\(0\.5\), 
            //showBackground: true, 
            //translucencyByDistance: new Cesium\.NearFarScalar\(10000, 1\.0, 800000, 0\.0\), 
            show:true, 
        \} 
    \}\);

On Tuesday, May 1, 2018 at 11:23:24 PM UTC-4, think.h...@gmail.com wrote:在 2018年5月2日星期三 UTC+8上午12:39:16，Gabby Getz写道：

> I'm not sure exactly what you mean here, can you create a Sandcastle example to show what the issue is?

>

>

> Thanks,

> Gabby

>

> On Saturday, April 28, 2018 at 3:09:03 AM UTC-4, think.h...@gmail.com wrote:1. A concise explanation of the problem you're experiencing.

> After adding the transparent background color to label, the bottom map is displayed, and the middle entity can not be seen. How can I solve it?

>

>

> 2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.

>

>

>

> 3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

>

>

>

> 4. The Cesium version you're using, your operating system and browser.

    var ellipse = viewer\.entities\.add\(\{

        name: 'ellipse',

        position: Cesium\.Cartesian3\.fromDegrees\(\-116\.3333, 39\.66666, 0\),

        ellipse: \{

            semiMinorAxis: 200000,

            semiMajorAxis: 200000,

            height: 0,

            material: Cesium\.Color\.RED,

        \}

    \}\);

    var label = viewer\.entities\.add\(\{

        name: 'label',

        id: 'label',

        position: Cesium\.Cartesian3\.fromDegrees\(\-116\.33555, 39\.66777, 0\),

        label: \{

            text: "this is a label",

            font: '25pt monospace',

            style: Cesium\.LabelStyle\.FILL\_AND\_OUTLINE,

            outlineWidth: 2,

            verticalOrigin: Cesium\.VerticalOrigin\.BOTTOM,

            pixelOffset: new Cesium\.Cartesian2\(0, 0\),

            backgroundColor: Cesium\.Color\.BLACK\.withAlpha\(0\.5\),

            showBackground: true,

            //translucencyByDistance: new Cesium\.NearFarScalar\(10000, 1\.0, 800000, 0\.0\),

            show:true,

        \}

    \}\);

The part of the ellipse below label becomes transparent.

thanks for the reply.
Setting the showBackground property of label to false can indeed avoid this problem. But my original intention was to give the label a background color. Is there any other way?
I found another problem. When dragging and controlling the map, part of that label is hidden by the underlying ellipse.Is this a bug?

6

Interestingly, on closer look, backgroundColor does not appear to be a property of LabelGraphics. Instead, try adding a billboard with your desired background below that label entity.

For the ordering, there was recently a regression in primitive ordering (see #6569), which I will bump with this report as well.

7

Actually, I think your partially hidden label is due to #4510.

8

backgroundColor was added to LabelGraphics and CZML in 1.29. Your link to the documentation points to 1.19.

9

Thanks Scott, my mistake!