index.html 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <link rel="icon" href="favicon.ico" type="image/x-icon">
  6. <title>四维展厅</title>
  7. <style>
  8. html,
  9. body {
  10. width: 100%;
  11. height: 100%;
  12. background-color: #000;
  13. color: #fff;
  14. margin: 0px;
  15. padding: 0;
  16. overflow: hidden;
  17. }
  18. </style>
  19. <link rel="stylesheet" href="https://laser.4dkankan.com/public/css/element.css">
  20. <link rel="stylesheet" href="https://laser.4dkankan.com/public/css/style.css">
  21. </head>
  22. <script type="text/javascript">
  23. const ossPrefix = 'https://laser.4dkankan.com/data/';
  24. const ossPrefixDep = 'https://laser.4dkankan.com/public/';
  25. const sceneNum = '@replace';
  26. //const sceneNum = 't-vZkqRV8';
  27. // const sceneNum = 't-iksBApb';
  28. // const sceneNum = 't-HMGa5zn';
  29. </script>
  30. <script src="https://laser.4dkankan.com/public/bus/bus.js"></script>
  31. <script src="https://laser.4dkankan.com/public/main.js?v=8"></script>
  32. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/OBJExporter.js"></script>
  33. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/Animation.js"></script>
  34. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/AnimationHandler.js"></script>
  35. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/KeyFrameAnimation.js"></script>
  36. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/ColladaLoader.js"></script>
  37. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/OBJLoader.js"></script>
  38. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/tinyqueue.js"></script>
  39. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/THREE.MeshLine.js"></script>
  40. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/custom.js"></script>
  41. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/utf.js"></script>
  42. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/jquery-1.8.0.js"></script>
  43. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/jquery.qrcode.js"></script>
  44. <script type="text/javascript" src="https://laser.4dkankan.com/public/js/proj4.js"></script>
  45. <script type="text/javascript">
  46. var indoorViewer;
  47. var run = false;
  48. IV.loaded(function() {
  49. indoorViewer = new IndoorViewer({
  50. 'base_url': 'https://laser.4dkankan.com/public/',
  51. 'onLoadComplete': setLayers
  52. });
  53. });
  54. var setLayers = function() {
  55. if (!run) {
  56. run = true;
  57. var setting = new Setting()
  58. var doorOpenCLose = new DoorOpenCLose();
  59. main_view.addToScene(doorOpenCLose);
  60. }
  61. };
  62. var DoorOpenCLose = function(e) {
  63. var main_view = IV.getMainView();
  64. // var model;
  65. // var animations;
  66. // var kfAnimations = [];
  67. // var kfAnimationsLength = 0;
  68. // var progress = 0;
  69. // var lastTimestamp = 0;
  70. // var pre_select_map_id = -1;
  71. // let path = './models/mesh/';
  72. // var mtlLoader = new IV.THREE.MTLLoader()
  73. // .setPath( path )
  74. // .load('mesh.mtl', function ( materials ) {
  75. // console.log(materials)
  76. // materials.preload();
  77. // // 加载obj
  78. // new IV.THREE.OBJLoader()
  79. // .setMaterials( materials )
  80. // .setPath( path )
  81. // .load('mesh.obj', function ( object ) {
  82. // // console.log(object)
  83. // // 设置旋转中心点
  84. // //object.children[0].geometry.computeBoundingBox();
  85. // //object.children[0].geometry.center()
  86. // object.position.x = 0;
  87. // object.position.y = 0;
  88. // object.position.z = 0;
  89. // // 将模型加入到场景
  90. // scene.add( object );
  91. // }, onProgress, onError );
  92. // });
  93. // OBJLoader_plugin();
  94. // var loader = new IV.THREE.OBJLoader();
  95. // loader.load('./models/mesh/mesh.obj', function (object) {
  96. // //controller = object.children[0];
  97. // var texture_loader = new IV.THREE.TextureLoader();
  98. // var material = new IV.THREE.MeshBasicMaterial();
  99. // main_view.scene.add(object);
  100. // });
  101. }
  102. /*
  103. if (!IV.custom) { //自定义功能集合
  104. IV.custom = {};
  105. }
  106. var loader_wall = new IV.THREE.ColladaLoader();
  107. loader_wall.load('./models/qt.dae', function(collada) {
  108. model = collada.scene.children[2];
  109. var material = new IV.THREE.MeshBasicMaterial({
  110. color: 0x00FA9A
  111. });
  112. material.colorWrite = false;
  113. model.children[0].material = material;
  114. model.renderOrder = 2;
  115. model.children[0].renderOrder = 2;
  116. main_view.overlayScene.add(model);
  117. //mesh.material.colorWrite = false;
  118. });
  119. var loader = new IV.THREE.ColladaLoader();
  120. */
  121. // loader.load('./models/m4.dae', function (collada) {
  122. // //console.log(collada)
  123. // model = collada.scene;
  124. // model.renderOrder = 3;
  125. // for (var j = 0; j < model.children.length; ++j) {
  126. // model.children[j].renderOrder = 3;
  127. // }
  128. // animations = collada.animations;
  129. // kfAnimationsLength = animations.length;
  130. // model.scale.x = model.scale.y = model.scale.z = 1;
  131. // main_view.scene.add(model);
  132. // //main_view.overlayScene.add(model);
  133. // //map_scene.add(model)
  134. // for (var i = 0; i < kfAnimationsLength; ++i) {
  135. // var animation = animations[i];
  136. // var kfAnimation = new IV.THREE.KeyFrameAnimation(animation);
  137. // kfAnimation.timeScale = 1;
  138. // kfAnimations.push(kfAnimation);
  139. // }
  140. // door_animation_start(0);
  141. // animate(lastTimestamp);
  142. // });
  143. function door_animation_start(time) {
  144. for (var i = 0; i < kfAnimationsLength; ++i) {
  145. var animation = kfAnimations[i];
  146. // if (animation.root.name === "animation_door1") {
  147. // console.log(animation.root.name)
  148. for (var h = 0, hl = animation.hierarchy.length; h < hl; h++) {
  149. var keys = animation.data.hierarchy[h].keys;
  150. var sids = animation.data.hierarchy[h].sids;
  151. var obj = animation.hierarchy[h];
  152. if (keys.length && sids) {
  153. for (var s = 0; s < sids.length; s++) {
  154. var sid = sids[s];
  155. var next = animation.getNextKeyWith(sid, h, 0);
  156. if (next) next.apply(sid);
  157. }
  158. obj.matrixAutoUpdate = false;
  159. animation.data.hierarchy[h].node.updateMatrix();
  160. obj.matrixWorldNeedsUpdate = true;
  161. }
  162. }
  163. // }
  164. animation.loop = false;
  165. animation.play(time);
  166. }
  167. }
  168. function animate(timestamp) {
  169. var frameTime = (timestamp - lastTimestamp) * 0.001;
  170. if (IV.custom.select_map_id && (pre_select_map_id !== IV.custom.select_map_id)) {
  171. pre_select_map_id = IV.custom.select_map_id;
  172. for (var i = 0; i < kfAnimationsLength; ++i) {
  173. kfAnimations[i].stop();
  174. }
  175. if (IV.custom.select_map_id === 2) {
  176. progress = 0;
  177. door_animation_start(6);
  178. } else if (IV.custom.select_map_id === 3) {
  179. progress = 0;
  180. door_animation_start(0);
  181. }
  182. }
  183. //console.log(progress,max_progress,start,end)
  184. if (progress >= 0 && progress < 6) {
  185. for (var i = 0; i < kfAnimationsLength; ++i) {
  186. //if (kfAnimations[i].root.name === "door1") {
  187. kfAnimations[i].update(frameTime);
  188. //}
  189. }
  190. } else if (progress >= 6) {
  191. for (var i = 0; i < kfAnimationsLength; ++i) {
  192. kfAnimations[i].stop();
  193. }
  194. // progress = 0;
  195. // door_animation_start();
  196. }
  197. main_view.invalidateScene();
  198. progress += frameTime;
  199. lastTimestamp = timestamp;
  200. requestAnimationFrame(animate);
  201. }
  202. </script>
  203. <script src="./js/index.js"></script>
  204. <body>
  205. <indoorviewer style="height: 100%"></indoorviewer>
  206. <div id="curscroll" style="position:absolute;visibility:hidden;padding: 2px 10px;z-index:2000"></div>
  207. </body>
  208. </html>