Location of ClippingPlaneCollection

CesiumJS
1

Hello community,
I have a question about the location of a ClippingPlaneCollection. On my image you see on the upper side the one for the globe, on the lower side the one for my tileset. But they don’t have the same location, I would like to situate the tilesets one on the globes one.
For the globe I use this function and a center position:

        globe.clippingPlanes = new Cesium.ClippingPlaneCollection({
            modelMatrix: Cesium.Transforms.eastNorthUpToFixedFrame(position),
            planes: [

When I use the same function for the tileset it will not load, when I use no definition for modelmatrix it looks like on the image.
Any tip would be great!

grafik
grafik1146×831 107 KB

2

Hi there,

The clipping planes modelMatrix are always relative to the root transformed of what is being clipped. For the globe, this is from the origin, so the modelMatrix you’ve calculated in your example should be fine. For the tileset, it will likely be a different root transform that is relative to the tileset origin.

Thanks,
Gabby

3

Hi Gabby,
thank you for this answer!

I’ve tried a few things to put the tileset clipping over the globe clipping, but so far I haven’t succeeded.
This is what I tried: (globeCenter is where the blue star is)

            const tilesetCenter = tileset.boundingSphere.center;
            const globeCenter = new Cesium.Cartesian3.fromDegrees(coordinate[0], coordinate[1]);
            const diffX = tilesetCenter.x - globeCenter.x;
            const diffY = tilesetCenter.y - globeCenter.y;

            const translation = new Cesium.Cartesian3(
                -diffX,
                diffY,
                0
            );
            this.clippingPlanes.modelMatrix = Cesium.Matrix4.fromTranslation(translation);

Screenshot 2023-09-18 174459
Screenshot 2023-09-18 1744591175×865 197 KB

You see I’m getting closer to the goal, but I’m still not there. Do you have an idea what is wrong?

Thank you and greetings
Guido

5

How about the following? It should “undo” any transform applied to the clipping planes to match the tileset, then apply the same transform as the globe.

        const inverse = Cesium.Matrix4.inverse(tileset.clippingPlanesOriginMatrix, new Cesium.Matrix4());
        const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(position);

        this.clippingPlanes.modelMatrix = Cesium.Matrix4.multiply(inverse, modelMatrix, this.clippingPlanes.modelMatrix)l
6

Hi Gabby,
this works great! Exactly what I need :slight_smile:

Screenshot 2023-09-20 095658
Screenshot 2023-09-20 095658649×515 339 KB

(‘clippingPlanesOriginMatrix’ is not mentioned in the api docs and my ide shows it as unresolved variable…)

Thank you a lot and kind regards
Guido