Advertisement
Guest User

Untitled

a guest
Oct 18th, 2019
98
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.41 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <!-- Use correct character set. -->
  5. <meta charset="utf-8">
  6. <!-- Tell IE to use the latest, best version. -->
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  8. <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
  9. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
  10. <title>Hello!</title>
  11. <script src="../Build/Cesium/Cesium.js"></script>
  12. <style>
  13. @import url(../Build/Cesium/Widgets/widgets.css);
  14. html, body, #cesiumContainer {
  15. width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
  16. }
  17.  
  18.  
  19. .toolbar-left {
  20. display: block;
  21. position: absolute;
  22. top: 5px;
  23. left: 5px;
  24. }
  25.  
  26. .toolbar-left2 {
  27. display: block;
  28. position: absolute;
  29. top: 20px;
  30. left: 20px;
  31. }
  32.  
  33.  
  34.  
  35. </style>
  36. </head>
  37. <body>
  38. <div id="cesiumContainer"></div>
  39. <div class="toolbar-left">
  40. <!-- <button onclick="move();">Click me!</button> -->
  41. <div id="buttonContainer" style="position:absolute; z-index:1;">
  42. <button onclick="move()" class="cesiumbutton">Move camera</button>
  43. <label for="output"></label><input type="textbox" name="output"></input>
  44. </div>
  45. </div>
  46. <div class="toolbar-left2">
  47.  
  48. </div>
  49. <script>
  50. var viewer = new Cesium.Viewer('cesiumContainer', {
  51. terrainProvider: Cesium.createWorldTerrain()
  52. });
  53.  
  54. function move() {
  55.  
  56. viewer.camera.flyTo({
  57. destination : Cesium.Cartesian3.fromDegrees(95.3, 27.5, 1500000.0)
  58. });
  59. }
  60.  
  61. viewer.scene.canvas.addEventListener('mousemove', function(e) {
  62. var ellipsoid = viewer.scene.globe.ellipsoid;
  63. // Mouse over the globe to see the cartographic position
  64. var cartesian = viewer.camera.pickEllipsoid(new Cesium.Cartesian3(e.clientX, e.clientY), ellipsoid);
  65. if (cartesian) {
  66. var cartographic = ellipsoid.cartesianToCartographic(cartesian);
  67. var longitudeString = Cesium.Math.toDegrees(cartographic.longitude).toFixed(3);
  68. var latitudeString = Cesium.Math.toDegrees(cartographic.latitude).toFixed(3);
  69. var out = '(' + longitudeString + ', ' + latitudeString + ')';
  70. document.getElementsByName('output')[0].value= out;
  71. } else {
  72. entity.label.show = false;
  73. }
  74.  
  75. });
  76.  
  77. </script>
  78. </body>
  79. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement