You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

measure.html 3.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1.0">
  6. <title>dc-example</title>
  7. <script src='/libs/dc-sdk/dc.base.min.js'></script>
  8. <script src='/libs/dc-sdk/dc.core.min.js'></script>
  9. <script>DC.baseUrl='../libs/dc-sdk/resources/'</script>
  10. <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'>
  11. <link href='../index.css' type='text/css' rel='stylesheet'>
  12. <style>
  13. *{
  14. margin: 0;
  15. padding: 0;
  16. }
  17. html,body,#viewer-container{
  18. width: 100%;
  19. height: 100%;
  20. overflow: hidden;
  21. }
  22. </style>
  23. </head>
  24. <body>
  25. <div id="viewer-container"></div>
  26. <div class="btn-box">
  27. <ul>
  28. <li><button onclick="gotoModel()">定位模型</button></li>
  29. <li><button onclick="deactivate()">清空</button></li>
  30. </ul>
  31. <ul>
  32. <li><button onclick="calcDistance()">空间测距</button></li>
  33. <li><button onclick="calcArea()">空间面积</button></li>
  34. <li><button onclick="calcAngle()">角度</button></li>
  35. <li><button onclick="calcHeight()">高度</button></li>
  36. <li><button onclick="calcHeading()">偏航角度</button></li>
  37. <li><button onclick="calcTriangleHeight()">三角测量</button></li>
  38. </ul>
  39. <ul>
  40. <li><button onclick="distanceSurface()">贴地测距</button></li>
  41. <li><button onclick="areaSurface()">贴地面积</button></li>
  42. <li><button onclick="calcModelAngle()">贴物角度</button></li>
  43. <li><button onclick="calcModelHeight()">贴物高度</button></li>
  44. <li><button onclick="calcModelTriangleHeight()">贴物三角</button></li>
  45. </ul>
  46. </div>
  47. <script>
  48. let viewer = undefined
  49. let tileset = undefined
  50. function calcDistance(){
  51. viewer.measure.distance()
  52. }
  53. function distanceSurface(){
  54. viewer.measure.distanceSurface()
  55. }
  56. function calcArea(){
  57. viewer.measure.area()
  58. }
  59. function areaSurface(){
  60. viewer.measure.areaSurface()
  61. }
  62. function calcAngle(){
  63. viewer.measure.angle()
  64. }
  65. function calcModelAngle(){
  66. viewer.measure.angle({
  67. clampToModel:true
  68. })
  69. }
  70. function calcHeight(){
  71. viewer.measure.height()
  72. }
  73. function calcModelHeight(){
  74. viewer.measure.height({
  75. clampToModel:true
  76. })
  77. }
  78. function calcHeading(){
  79. viewer.measure.heading()
  80. }
  81. function areaHeight(){
  82. viewer.measure.areaHeight()
  83. }
  84. function calcTriangleHeight(){
  85. viewer.measure.triangleHeight()
  86. }
  87. function calcModelTriangleHeight(){
  88. viewer.measure.triangleHeight({
  89. clampToModel:true
  90. })
  91. }
  92. function deactivate(){
  93. viewer.measure.deactivate()
  94. }
  95. function gotoModel(){
  96. viewer.flyTo(tileset)
  97. }
  98. function initViewer() {
  99. viewer = new DC.Viewer('viewer-container')
  100. let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer({
  101. style:'img',
  102. crs:"WGS84"
  103. })
  104. viewer.addBaseLayer(baselayer)
  105. viewer.use(new DC.Measure())
  106. let layer = new DC.TilesetLayer('layer').addTo(viewer)
  107. tileset = new DC.Tileset(
  108. '//resource.dvgis.cn/data/3dtiles/dayanta/tileset.json'
  109. )
  110. tileset.setHeight(-420)
  111. layer.addOverlay(tileset)
  112. viewer.flyTo(tileset)
  113. }
  114. DC.ready(initViewer)
  115. </script>
  116. </body>
  117. </html>