-
-
Save typebrook/6ad0ad910c26f068c95e79e151b02020 to your computer and use it in GitHub Desktop.
Index file for Cesium NYC application #cesium #3d #arcgis #nlsc #citygml
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta | |
| name="viewport" | |
| content="initial-scale=1,maximum-scale=1,user-scalable=no" | |
| /> | |
| <title>Intro to SceneLayer | Sample | ArcGIS API for JavaScript 4.16</title> | |
| <style> | |
| html, | |
| body, | |
| #viewDiv { | |
| padding: 0; | |
| margin: 0; | |
| height: 100%; | |
| width: 100%; | |
| } | |
| </style> | |
| <link | |
| rel="stylesheet" | |
| href="https://js.arcgis.com/4.16/esri/themes/light/main.css" | |
| /> | |
| <script src="https://js.arcgis.com/4.16/"></script> | |
| <script> | |
| require([ | |
| "esri/Map", | |
| "esri/views/SceneView", | |
| "esri/layers/SceneLayer" | |
| ], function (Map, SceneView, SceneLayer) { | |
| // Create Map | |
| var map = new Map({ | |
| basemap: "dark-gray-vector", | |
| ground: "world-elevation" | |
| }); | |
| // Create the SceneView | |
| var view = new SceneView({ | |
| container: "viewDiv", | |
| map: map, | |
| camera: { | |
| position: [121.738843, 25.131318, 707], | |
| tilt: 81, | |
| heading: 50 | |
| } | |
| }); | |
| // Create SceneLayer and add to the map | |
| var sceneLayer = new SceneLayer({ | |
| url: "https://mapserver01.nlsc.gov.tw/LOD1/i3s/rest/services/nlsc/SceneServer/layers/3" | |
| }); | |
| map.add(sceneLayer); | |
| // Create MeshSymbol3D for symbolizing SceneLayer | |
| var symbol = { | |
| type: "mesh-3d", // autocasts as new MeshSymbol3D() | |
| symbolLayers: [ | |
| { | |
| type: "fill", // autocasts as new FillSymbol3DLayer() | |
| // If the value of material is not assigned, the default color will be grey | |
| material: { | |
| color: [244, 247, 134] | |
| } | |
| } | |
| ] | |
| }; | |
| // Add the renderer to sceneLayer | |
| sceneLayer.renderer = { | |
| type: "simple", // autocasts as new SimpleRenderer() | |
| symbol: symbol | |
| }; | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <div id="viewDiv"></div> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <script src="https://cesium.com/downloads/cesiumjs/releases/1.68/Build/Cesium/Cesium.js"></script> | |
| <link href="https://cesium.com/downloads/cesiumjs/releases/1.68/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div id="cesiumContainer" style="width: 100%; height:100%"></div> | |
| <script> | |
| var viewer = new Cesium.Viewer('cesiumContainer'); | |
| var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ | |
| url: "https://mapserver01.nlsc.gov.tw/LOD1/tiles3d/基隆市近似模型/tileset.json", | |
| })) | |
| Cesium.when(tileset.readyPromise).then(function (tileset) {viewer.flyTo(tileset)}) // fly to 3D tiles after loading! | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment