gpt.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CesiumJS Web Map Application</title>
    <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">
    <style>
        html, body, #cesiumContainer {
            width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
        }
    </style>
</head>
<body>
    <div id="cesiumContainer"></div>
    <script>
        // Initialize the Cesium Viewer
        var viewer = new Cesium.Viewer('cesiumContainer', {
            imageryProvider: new Cesium.OpenStreetMapImageryProvider({
                url : 'https://a.tile.openstreetmap.org/'
            }),
            baseLayerPicker: false,
            terrainProvider: new Cesium.CesiumTerrainProvider({
                url: 'https://web3d.basemap.de/cesium/dgm5-mesh'
            })
        });

        // Set the initial view
        viewer.scene.camera.setView({
            destination: Cesium.Cartesian3.fromDegrees(9.6473353, 47.5728539, 3500.0)
        });

        // Load 3D Tiles
        var tileset = new Cesium.Cesium3DTileset({
            url: 'https://web3d.basemap.de/cesium/buildings-fly/root.json'
        });
        viewer.scene.primitives.add(tileset);

        // Load additional 2D ArcGisMapServerImagery
        var arcGisImagery = new Cesium.ArcGisMapServerImageryProvider({
            url: 'https://tiles.arcgis.com/tiles/1lplwYilIlo008hQ/arcgis/rest/services/HighFloodRisk_ExportFeatures/MapServer'
        });
        viewer.imageryLayers.addImageryProvider(arcGisImagery);
    </script>
</body>
</html>