features_ca13.html 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="description" content="">
  6. <meta name="author" content="">
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  8. <title>Potree Viewer</title>
  9. <link rel="stylesheet" type="text/css" href="../build/potree/potree.css">
  10. <link rel="stylesheet" type="text/css" href="../libs/jquery-ui/jquery-ui.min.css">
  11. <link rel="stylesheet" type="text/css" href="../libs/openlayers3/ol.css">
  12. <link rel="stylesheet" type="text/css" href="../libs/spectrum/spectrum.css">
  13. <link rel="stylesheet" type="text/css" href="../libs/jstree/themes/mixed/style.css">
  14. </head>
  15. <body>
  16. <script src="../libs/jquery/jquery-3.1.1.min.js"></script>
  17. <script src="../libs/spectrum/spectrum.js"></script>
  18. <script src="../libs/jquery-ui/jquery-ui.min.js"></script>
  19. <script src="../libs/other/BinaryHeap.js"></script>
  20. <script src="../libs/tween/tween.min.js"></script>
  21. <script src="../libs/d3/d3.js"></script>
  22. <script src="../libs/proj4/proj4.js"></script>
  23. <script src="../libs/openlayers3/ol.js"></script>
  24. <script src="../libs/i18next/i18next.js"></script>
  25. <script src="../libs/jstree/jstree.js"></script>
  26. <script src="../build/potree/potree.js"></script>
  27. <script src="../libs/plasio/js/laslaz.js"></script>
  28. <!-- INCLUDE ADDITIONAL DEPENDENCIES HERE -->
  29. <!-- INCLUDE SETTINGS HERE -->
  30. <div class="potree_container" style="position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; ">
  31. <div id="potree_render_area" style="background-image: url('../build/potree/resources/images/background.jpg');"></div>
  32. <div id="potree_sidebar_container"> </div>
  33. </div>
  34. <script type="module">
  35. import * as THREE from "../libs/three.js/build/three.module.js";
  36. window.viewer = new Potree.Viewer(document.getElementById("potree_render_area"));
  37. viewer.setEDLEnabled(true);
  38. viewer.setFOV(60);
  39. viewer.setPointBudget(3_000_000);
  40. viewer.loadSettingsFromURL();
  41. viewer.setDescription("");
  42. viewer.loadGUI(() => {
  43. viewer.setLanguage('en');
  44. $("#menu_appearance").next().show();
  45. $("#menu_tools").next().show();
  46. $("#menu_scene").next().show();
  47. viewer.toggleSidebar();
  48. });
  49. // CA13
  50. Potree.loadPointCloud("http://5.9.65.151/mschuetz/potree/resources/pointclouds/opentopography/CA13/cloud.js", "CA13", function(e){
  51. let pointcloud = e.pointcloud;
  52. let scene = viewer.scene;
  53. let material = pointcloud.material;
  54. scene.addPointCloud(pointcloud);
  55. pointcloud.position.z = 0;
  56. material.size = 1;
  57. material.pointSizeType = Potree.PointSizeType.ADAPTIVE;
  58. scene.view.position.set(690711.599, 3873671.422, 51647.850);
  59. scene.view.lookAt(705119.301, 3920506.695, -564.566);
  60. { // ANNOTATIONS
  61. let aRoot = viewer.scene.annotations;
  62. let aCA13 = new Potree.Annotation({
  63. title: "CA13",
  64. position: [675036.45, 3850315.78, 65076.70],
  65. cameraPosition: [675036.45, 3850315.78, 65076.70],
  66. cameraTarget: [692869.03, 3925774.14, 1581.51],
  67. });
  68. aRoot.add(aCA13);
  69. let aSanSimeon = new Potree.Annotation({
  70. title: "San Simeon",
  71. position: [664147.50, 3946008.73, 16.30],
  72. cameraPosition: [664941.80, 3943568.06, 1925.30],
  73. cameraTarget: [664147.50, 3946008.73, 16.30],
  74. });
  75. aCA13.add(aSanSimeon);
  76. let aHearstCastle = new Potree.Annotation({
  77. title: "Hearst Castle",
  78. position: [665744.56, 3950567.52, 500.48],
  79. cameraPosition: [665692.66, 3950521.65, 542.02],
  80. cameraTarget: [665744.56, 3950567.52, 500.48],
  81. });
  82. aCA13.add(aHearstCastle);
  83. let aMorroBay = new Potree.Annotation({
  84. title: "Morro Bay",
  85. position: [695483.33, 3916430.09, 25.75],
  86. cameraPosition: [694114.65, 3911176.26, 3402.33],
  87. cameraTarget: [695483.33, 3916430.09, 25.75],
  88. });
  89. aCA13.add(aMorroBay);
  90. let aMorroRock = new Potree.Annotation({
  91. title: "Morro Rock",
  92. position: [693729.66, 3916085.19, 90.35],
  93. cameraPosition: [693512.77, 3915375.61, 342.33],
  94. cameraTarget: [693729.66, 3916085.19, 90.35],
  95. });
  96. aMorroBay.add(aMorroRock);
  97. let aMorroBayMutualWaterCo = new Potree.Annotation({
  98. title: "Morro Bay Mutual Water Co",
  99. position: [694699.45, 3916425.75, 39.78],
  100. cameraPosition: [694377.64, 3916289.32, 218.40],
  101. cameraTarget: [694699.45, 3916425.75, 39.78],
  102. });
  103. aMorroBay.add(aMorroBayMutualWaterCo);
  104. let aLilaKeiserPark = new Potree.Annotation({
  105. title: "Lila Keiser Park",
  106. position: [694674.99, 3917070.49, 10.86],
  107. cameraPosition: [694452.59, 3916845.14, 298.64],
  108. cameraTarget: [694674.99, 3917070.49, 10.86],
  109. });
  110. aMorroBay.add(aLilaKeiserPark);
  111. let aSanLuisObispo = new Potree.Annotation({
  112. title: "San Luis Obispo",
  113. position: [712573.39, 3907588.33, 146.44],
  114. cameraPosition: [711158.29, 3907019.82, 1335.89],
  115. cameraTarget: [712573.39, 3907588.33, 146.44],
  116. });
  117. aCA13.add(aSanLuisObispo);
  118. let aLopezHill = new Potree.Annotation({
  119. title: "Lopez Hill",
  120. position: [728635.63, 3895761.56, 456.33],
  121. cameraPosition: [728277.24, 3895282.29, 821.51],
  122. cameraTarget: [728635.63, 3895761.56, 456.33],
  123. });
  124. aCA13.add(aLopezHill);
  125. let aWhaleRockReservoir = new Potree.Annotation({
  126. title: "Whale Rock Reservoir",
  127. position: [692845.46, 3925528.53, 140.91],
  128. cameraPosition: [693073.32, 3922354.02, 2154.17],
  129. cameraTarget: [692845.46, 3925528.53, 140.91],
  130. });
  131. aCA13.add(aWhaleRockReservoir);
  132. }
  133. { // TREE RETURNS POI - ANNOTATION & VOLUME
  134. let aRoot = scene.annotations;
  135. let aTreeReturns = new Potree.Annotation({
  136. title: "Tree Returns",
  137. position: [675756.75, 3937590.94, 80.21],
  138. cameraPosition: [675715.78, 3937700.36, 115.95],
  139. cameraTarget: [675756.75, 3937590.94, 80.21],
  140. actions: [{
  141. "icon": Potree.resourcePath + "/icons/return_number.svg",
  142. "onclick": function(){
  143. material.activeAttributeName = "return number";
  144. material.pointSizeType = Potree.PointSizeType.FIXED;
  145. viewer.setClipTask(Potree.ClipTask.SHOW_INSIDE);
  146. }
  147. },{
  148. "icon": Potree.resourcePath + "/icons/rgb.png",
  149. "onclick": function(){
  150. material.activeAttributeName = "rgba";
  151. material.pointSizeType = Potree.PointSizeType.ADAPTIVE;
  152. viewer.setClipTask(Potree.ClipTask.HIGHLIGHT);
  153. }
  154. }]
  155. });
  156. aRoot.add(aTreeReturns);
  157. aTreeReturns.domElement.find(".annotation-action-icon:first").css("filter", "invert(1)");
  158. let volume = new Potree.BoxVolume();
  159. volume.position.set(675755.4039368022, 3937586.911614576, 85);
  160. volume.scale.set(119.87189835418388, 68.3925257233834, 51.757483718373265);
  161. volume.rotation.set(0, 0, 0.8819755090987993, "XYZ");
  162. volume.clip = true;
  163. volume.visible = false;
  164. volume.name = "Trees";
  165. scene.addVolume(volume);
  166. }
  167. { // MEASUREMENTS
  168. {
  169. let measurement = new Potree.Measure();
  170. measurement.addMarker([649883.34, 3964419.93, 815.99]);
  171. measurement.addMarker([648709.04, 3963016.51, 2.36]);
  172. measurement.showHeight = true;
  173. measurement.showDistances = false;
  174. measurement.name = "Mountain Height";
  175. viewer.scene.addMeasurement(measurement);
  176. }
  177. {
  178. let measurement = new Potree.Measure();
  179. measurement.addMarker([655447.29, 3948399.92, 19.26]);
  180. measurement.addMarker([655411.81, 3948369.64, 17.84]);
  181. measurement.name = "Parking Space";
  182. viewer.scene.addMeasurement(measurement);
  183. }
  184. {
  185. let measurement = new Potree.Measure();
  186. measurement.addMarker([646037.800, 3971448.200, 819.990]);
  187. measurement.addMarker([736909.820, 3891012.300, 296.000]);
  188. viewer.scene.addMeasurement(measurement);
  189. }
  190. }
  191. });
  192. </script>
  193. </body>
  194. </html>