index_dusseldorf_testdata.html

<html lang="en">

<head>
    <meta charset="utf-8">
    <script src="https://cesium.com/downloads/cesiumjs/releases/1.94/Build/Cesium/Cesium.js"></script>
    <link href="https://cesium.com/downloads/cesiumjs/releases/1.94/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>

<body>
    <div id="cesiumContainer" style="width: 100%; height:100%"></div>
    <script>
        Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJmNDI1ZTg5OC05MWU1LTQ5YTYtOTEyZS1mODk1ODZiZGRhMjgiLCJpZCI6MTcxNDQsImlhdCI6MTY4MDIwNTA2MX0.fM4zc4RUfbrgLvaD4FXP-EUNMceSRA1ILRt2qVNACpc';
        var viewer = new Cesium.Viewer('cesiumContainer', {
            // terrainProvider: Cesium.createWorldTerrain(),
            baseLayerPicker: true,
            vrButton: true,
            geocoder: true,
            navigationHelpButton: false,
            selectionIndicator: false,
            shadows: false,
            timeline: false,
            sceneModePicker: true,
            imageryProvider: new Cesium.MapboxStyleImageryProvider({
                // check style ID at https://docs.mapbox.com/api/maps/styles/
                styleId: 'light-v10',
                // styleId: 'navigation-day-v1',
                accessToken: 'pk.eyJ1IjoidGh1bnlhdGhlcCIsImEiOiJjamFpOWV4a2gxd21vMndxdXd2M3VoY3hmIn0.jLlCscei0yH-ZHwcfxF_ug'
            })
            // imageryProvider: new Cesium.OpenStreetMapImageryProvider({
            //     url: 'https://a.tile.openstreetmap.org/'
            // }),
        });
        var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
            url: "dusseldorf_test/tileset.json"
        }))
        tileset.readyPromise.then(function (tileset) {
            viewer.camera.setView({"destination":{"x":3975584.996584384,"y":472403.2984956568,"z":4948777.681824778},"orientation":{"direction":{"x":-0.9813492013964527,"y":-0.11660990775296645,"z":0.15282628809334237},"up":{"x":0.15175865442382225,"y":0.018032890502059265,"z":0.9882530676236789}}})
            // viewer.flyTo(tileset)
            var boundingSphere = tileset.boundingSphere;
            // viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0, -2.0, 0));
            // viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
            // Position tileset
            var cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center);
            var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
            var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, -35);
            var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
            tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation);
            console.log(tileset.modelMatrix);

        });

        // tileset.style = new Cesium.Cesium3DTileStyle({
        //     show: true,
        //     // color: "color('#ffffff')"
        //     "color": {
        //         "conditions": [
        //             ["true", "color('#ffffff')"]
        //         ]
        //     }
        // });
        

        // viewer.extend(Cesium.viewerCesium3DTilesInspectorMixin);
    </script>
</body>

</html>