How to syle cesium osm buildings?

I want to adjust the color of cesium osm buildings by height.
How do I do that?

2 Likes

@Yorankrol

Welcome to the community :confetti_ball: Cesium3DTileStyle is the secret to coloring the OSM Buildings by height. Here is the documentation for your reference:

https://cesium.com/learn/cesiumjs/ref-doc/Cesium3DTileStyle.html

You will have to update tileset.style with a new Cesium3DTileStyle. This can be done as follows:

tileset.style = new Cesium.Cesium3DTileStyle({
    color : {
        conditions : [
            ['${Height} >= 100', 'color("purple", 0.5)'],
            ['${Height} >= 50', 'color("red")'],
            ['true', 'color("blue")']
        ]
    },
    show : '${Height} > 0',
    meta : {
        description : '"Building id ${id} has height ${Height}."'
    }
});

Let me know if you have any other questions or concerns.

Best,
Sam

Thank you!!

@Yorankrol

You are welcome! Let me know if anything else comes up :grinning_face_with_smiling_eyes:

Best,
Sam

Heyy,

I have a question.
So I’m new to Cesium and Unreal as you know. So I don’t understand how to update ‘‘tileset.style’’ with a new ‘‘Cesium3DTileStyle’’.

Best,
Yoran

So I’m trying a little bit, but it doesn’t work. I have no idea where to update that code. Could you explain it a little more specifically?

Hello @Yorankrol,

I think @sam.rothstein assumed you were using CesiumJS, you are using Cesium for Unreal currently right? In Cesium for Unreal, we have only recently implemented metadata picking through a blueprint/C++ api (tutorials will be coming for this soon). Currently this lets you do CPU queries on parts of the tileset to retrieve available metadata such as building height. We will soon be tackling styling of tilesets, which will make the metadata available in the tileset’s material graph, making it possible to color or texture based on such metadata.

Nithin Pranesh

1 Like

Thank you!!

@Nithin_Pranesh

Thank you for taking a look at this post. I believe that this thread may have been tagged as CesiumJS originally, which is why I posted the above response. Regardless, I am happy to see that this has been resolved :grinning_face_with_smiling_eyes:

-Sam