cesium.html 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <!-- Include the CesiumJS JavaScript and CSS files -->
  6. <script src="./js/Cesium.js?t=asd"></script>
  7. <link href="./js/widgets.css" rel="stylesheet">
  8. <style>
  9. * {
  10. margin: 0;
  11. padding: 0;
  12. border: 0;
  13. }
  14. #cesiumContainer {
  15. width: 100vw;
  16. height: 100vh;
  17. }
  18. .cesium-viewer-toolbar {
  19. display: none;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <div id="cesiumContainer"></div>
  25. <script type="module">
  26. // https://cesium.com/downloads/cesiumjs/releases/1.123/Build/Cesium/Widgets
  27. // Your access token can be found at: https://ion.cesium.com/tokens.
  28. // Replace `your_access_token` with your Cesium ion access token.
  29. Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIxOGJlY2NkYy04NGZiLTQ2MzYtYWJmZi0xNzNlNDk0N2Q2YjAiLCJpZCI6MjUyOTI2LCJpYXQiOjE3MzA3ODY3MTN9.GiCzHsI5RCIWSPp5aiI7mvsu0emeCtjrTNOpwyIK7zw';
  30. // window.CESIUM_BASE_URL = 'https://sandcastle.cesium.com/CesiumUnminified/';
  31. // Initialize the Cesium Viewer in the HTML element with the `cesiumContainer` ID.
  32. const viewer = new Cesium.Viewer('cesiumContainer', {
  33. terrain: Cesium.Terrain.fromWorldTerrain(),
  34. vrButton:true
  35. });
  36. viewer.scene.focalLength = 100 //焦距
  37. viewer.scene.eyeSeparation = 0.06 //瞳距
  38. document.documentElement.addEventListener('fullscreenchange', e => {
  39. e.stopPropagation()
  40. e.preventDefault()
  41. console.log('???')
  42. })
  43. viewer.camera.flyTo({
  44. destination: Cesium.Cartesian3.fromDegrees(-104.9965, 39.74248, 4000)
  45. });
  46. // Add Cesium OSM Buildings.
  47. const buildingsTileset = await Cesium.createOsmBuildingsAsync();
  48. viewer.scene.primitives.add(buildingsTileset);
  49. </script>
  50. </div>
  51. </body>
  52. </html>