Ground plane artifact at certain view angles, LOD, CesiumJS B3DM

CesiumJS
1

Dear all,

I need some help with a weird artifact displaying on some of my B3DM tiles. Does anyone recognize this error? Any ideas what could be the cause/how to solve this? Many thanks in advance!

The issue:
Only at certain camera positions (zoom and/or angle) a large flat (brown) plane appears, at some distance from the ground. It gives the impression of the city being flooded. See the images to get a better idea of the issue. Live demo available below as well.

I copied the tiles straight from the creator (company) azure blob storage, to our own azure blob storage. The company uses the same files in their platform (not cesium) without problems, hinting towards a cesium rendering problem. On the other hand, the tiles from last year work perfectly and I didnt’t change any cesium setting before getting this issue, hinting at a tile issue.

Some examples: The ground does continue below the straight plane. Note the sudden edge of the brown plane in the first image.

image
image1114×732 86.5 KB

image
image1243×703 90.1 KB

image
image824×629 71.4 KB

For live demo, go to Digitale Tweeling Alkmaar and click the bottom left map icon and choose ‘Fotorealistisch’ to see the cesium view. The issue is at that camera position, just zoom/rotate the camera around a bit and the brown planes will appear.

image
image700×269 108 KB

Steps already taken:

  • updated cesiumJs from 1.82 to 1.102

  • Loaded only 1 tile (out of many, some with/some without the issue)

  • Tried lower maximumScreenSpaceError (down to 100, did not help)

  • Height position of b3dm file is correct, it is not another layer coming through the object. The height and color of the brown plane varies slightly depending on the viewpoint.

  • This similar issue solution, the brown planes just get black: 3d tiles loading artifacts when moving camera - #6 by omar.
    Code:
    var tileset_buildings = tilesArray.forEach(tile => viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
    url : base_tileset_url + tile,
    useSimpleLighting: false,
    maximumScreenSpaceError: 10,
    dynamicScreenSpaceError : false,
    dynamicScreenSpaceErrorDensity : 0.00278,
    dynamicScreenSpaceErrorFactor : 4.0, // 4.0
    dynamicScreenSpaceErrorHeightFalloff : 0.25,
    skipLevelOfDetail: false,
    skipLevels: 0
    })));

    tileset_buildings.tileLoad.addEventListener((tile)=> {
    console.log("error is: " + tile.geometricError)
    if (tile.geometricError > 1000) {
    tile.color = new Color(1.0, 0.5, 0.0, 0.3);
    }
    });

    image
    image699×609 72.6 KB

  • skipLevelOfDetail: false, although true does seem to have an effect, the plane looks to be split up in smaller squares that show/hide while loading, but after loading the final result is the same.

Code:
I’ve tweaked these from standard (just the tileset url), to some variations. live view is still cesium version 1.82:

    var tileset_buildings = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
        url : cyclomedia_tileset_url,
        useSimpleLighting: true,
        maximumScreenSpaceError: 2,
        dynamicScreenSpaceError : true,
        dynamicScreenSpaceErrorDensity : 0.00278,
        dynamicScreenSpaceErrorFactor : 6.0,
        dynamicScreenSpaceErrorHeightFalloff : 0.25
    }));

viewer.scene.primitives.add(new Cesium.Cesium3DTileset({url : base_tileset_url });

If you have any suggestions/solutions, they are welcome!

2

Hello there,

You mentioned you brought a tileset into your app previously and it was working fine. Do you happen to know what the Cesium version was? Was it also 1.82?

To sanity check your dataset validity, could you please run it through the 3d-tiles-validator and let us know the results? It would also help if you could provide us with the dataset for troubleshooting.

Thanks!
Gabby