Clipping planes problem

CesiumJS
1

I’m having some problems with clipping planes. They have no effect on cesium tiles (exported from agisoft metashape).

Example with cesium tiles from metashape: https://testkartor.umea.se/3D/test/

Nothing happens. But if I change the tileset URL to an ion resource. It works perfectly fine. And I can’t figure out why…

Could it be the modelMatrix?
Cesium.Matrix4.inverse(tileset.root.computedTransform, new Cesium.Matrix4())

Any advice would be greatly appriciated :slight_smile: thanks!

2

This is the code:

var dig_point = [
    new Cesium.Cartesian3.fromDegrees(20.24418855999141, 63.82015459978235),
    new Cesium.Cartesian3.fromDegrees(20.25139109125409, 63.818916542464265),
    new Cesium.Cartesian3.fromDegrees(20.250973969629612, 63.814013746004946),
    new Cesium.Cartesian3.fromDegrees(20.23750570105997, 63.81444392633881)
];
var clippingPlanes = [];
var pointsLength = dig_point.length;
for (var i = 0; i < pointsLength; ++i) {
    var nextIndex = (i + 1) % pointsLength;
    var midpoint = Cesium.Cartesian3.add(dig_point[i], dig_point[nextIndex], new Cesium.Cartesian3());
    midpoint = Cesium.Cartesian3.multiplyByScalar(midpoint, 0.5, midpoint);
    var up = Cesium.Cartesian3.normalize(midpoint, new Cesium.Cartesian3());
    var right = Cesium.Cartesian3.subtract(dig_point[nextIndex], midpoint, new Cesium.Cartesian3());
    right = Cesium.Cartesian3.normalize(right, right);
    var normal = Cesium.Cartesian3.cross(right, up, new Cesium.Cartesian3());
    normal = Cesium.Cartesian3.normalize(normal, normal);
    if (!false) { normal = Cesium.Cartesian3.multiplyByScalar(normal, -1, normal); }
    var plane = new Cesium.Plane.fromPointNormal(midpoint, normal);
    var clippingPlane = new Cesium.ClippingPlane.fromPlane(plane);
    clippingPlanes.push(clippingPlane);
}
var tileset = viewer.scene.primitives.add(
    new Cesium.Cesium3DTileset({
        url: "../Tileset/Stadsmodell/tileset.json",
        maximumScreenSpaceError: 2
    })
);
tileset.readyPromise.then(function () {
    tileset.clippingPlanes = new Cesium.ClippingPlaneCollection({
        planes: clippingPlanes,
        modelMatrix: Cesium.Matrix4.inverse(tileset.root.computedTransform, new Cesium.Matrix4())
    });
}).otherwise(function (error) {
    console.log(error);
});
3

Hi @ariel,

Apologies for the delayed response. Is it possible to upload the tileset.json that you’re using, so I may experiment with it on my own machine? Alternatively, you can give me the asset ID and I can download it on my own.

Best regards,
Janine

4

Thank you for the reply. With ion resources it works perfectly fine. But when hosting myself (not as an ion resource) as cesium tiles exported from Metashape I can’t make it work.

I don’t have enough storage on ion to upload it. It’s almost 100gb…

5

Hi @ariel,

When you say you have tried this “with ion resources,” can you confirm that you mean resources that are different from the tileset.json you first mentioned?

Best regards,
Janine

6

Hi,

https://testkartor.umea.se/3D/ion-hosted/

Above example has same code but with an resource from ion. Works fine. Problem is when exporting the tileset from Metashape like in this example: https://testkartor.umea.se/3D/test/

Sorry for bad explanation.

7

Hi @ariel,

You’re fine, it’s not a bad explanation! I just needed to clarify some things to narrow down the problem.

The ClippingPlaneCollection documentation specifies some rules for how clipping planes are applied to 3D Tiles:

For 3D Tiles, the root tile’s transform is used to position the clipping planes. If a transform is not defined, the root tile’s Cesium3DTile#boundingSphere is used instead.

It’s possible the tileset you exported from Metashape doesn’t have a tile transform, though we would have to look at the tileset.json to confirm. I would experiment with one clipping plane first and ensure that it is positioned correctly before continuing to add more.

Let me know if I can offer any more support!

Best,
Janine