Symbols are cut when using bilboard

Hi everyone,

my icons (cicle and triangle as png) are being cut when I use billboard (see attachment). Does anyone have an idea what I am missing there?

Version: 1.55.0

Does this happen only in certain camera perspectives? Are you able to reproduce this in Sandcastle (https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/) ?

Hey Omay,

thank you for your post.

Now I know more... I generate svg as follows:

const value = entity.attributes.id

const svgString =
            '<svg xmlns="http://www.w3.org/2000/svg" width="200" height="105">' +
            '<rect width="200" height="200" style="fill:rgba(255, 255, 255, 0.8);stroke-width:0" />' +
            '<text x="5" y="20" fill="black">' + value + '</text>' +
            '</svg>';

where value is a number. With a string value, is everything is ok. So:

const value = entity.attributes.name

But also

const value = 123456

is ok.

I’m surprised that fixes it. Are you saying changing the way you construct your SVG icon fixes the billboard circle and triangle getting cut, which are PNG images given to a billboard?

Are the circle and triangle being created like this:

viewer.entities.add({
position : Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883),
billboard :{
image : ‘…/images/Triangle.png’
}
});

``

Like in this billboard example?

Yes, I do the same.

I have just no idea what the difference hier is:

const value = 12345;
...
<text x="5" y="20" fill="black">' + value + '</text>'
...
(it works)

and

const value = entity.attributes.id; // or any attribute with a value as number
...
<text x="5" y="20" fill="black">' + value + '</text>'
...
(it does not work)

Hi Omar,

I finally could find out the reason of this strange behavior... I have more than 1000 entities with unique ids. So it will be more than 1000 different svg images for the labels generated and I think this is an expensive progress. When I use an static integer (const value = 12345) instead of 'entity.attributes.id', the svg image ist the same for all entities. That's why png symbols are rendered without getting cut...

I hope I could explain it well :slight_smile:

Thanks for digging into this and posting your solution! If I’m able to recreate this in a Sandcastle example I’ll open a bug report. Otherwise, I’m sure this will help anyone else running into this.

I could reproduce it in a Sandcastle and have already opened a bug report here:

Thank you