Disable rendering in an area of Photorealistic 3D Tiles from polygon coordinates

Hello everyone, I have a map with a 3d building as an asset and the 3d titles from Google. The building is in a square, and I wanted to disable rendering in that square because the trees cover the building, I already have the polygon coordinates of the square.
My code is very similar to this example:

What I want is to disable rendering in the yellow area of the example.

I read several topics and saw the examples and managed to understand that it is necessary to use ClippingPlaneCollection, but I could not adapt it to work in my code, I am starting now with cesiumjs, until now I used cesium for unreal.
Thanks immensely for any help.

Hello,

I would try to mimic the St. Helens example from our clipping sandcastle Cesium Sandcastle. Lines 97-221 show how to take a list of points that make a polygon and turn them into a ClippingPlaneCollection that clips the inside of the polygon. Is that St. Helens example what you are aiming for?

1 Like

Thank you very much @Erixen_Cruz , I can reproduce the example indicated for what I wanted. But it only worked for “2D” satellite images, like bing aerial images. When I adapted the code to load Google’s 3d tileset it doesn’t crop the image. The crop outline appears, but the image is not cropped.

Working example:

working example in 2d images

Example with trying to work with 3d tilesets:
Example with trying to work with 3d tilesets:

You need to assign the clipping plane collection to the tileset:
https://cesium.com/learn/cesiumjs/ref-doc/Cesium3DTileset.html?classFilter=cesium3dTileset#clippingPlanes