【前端】智能库房综合管理系统前端项目
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.

1760 lines
53 KiB

3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
  1. // 从这里开始
  2. var h1 = null;
  3. var h2 = null;
  4. var h3 = null;
  5. var oldtransformNodex = null;
  6. var oldtransformNodeOther = null;
  7. var drag = null;
  8. var notmoveGroup = null;
  9. var movedGroup = null;
  10. var movesingle = false;
  11. var dynamicTexture = null;
  12. var dynamicTexture2 = null;
  13. var dynamicTexture3 = null;
  14. var dynamicTexture4 = null;
  15. var show = 50;
  16. var showdd = 50;
  17. var PointerOverYangan = null;
  18. var deviceData = [];
  19. BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function() {
  20. if (document.getElementById("customLoadingScreenDiv")) {
  21. document.getElementById("customLoadingScreenDiv").style.display = "initial";
  22. // 给vue页面传值,加载完成之前
  23. parent.getIframeLoading("true")
  24. return;
  25. }
  26. this._loadingDiv = document.createElement("div");
  27. //this._loadingDiv.style.height = '1750px';
  28. this._loadingDiv.id = "customLoadingScreenDiv";
  29. thecss = "lohingifpc";
  30. thecss2 = "zcpc";
  31. this._loadingDiv.innerHTML =
  32. "<div class='oka'><div class='" +
  33. thecss +
  34. "'><image src='./logok.gif' class='jiazaiimg'/></div><div class='" +
  35. thecss2 +
  36. "'>由 <image class='feitimg' src='./img/yxlogo.png'/> 阅行客 提供技术支持!</div></div>";
  37. this._resizeLoadingUI();
  38. window.addEventListener("resize", this._resizeLoadingUI);
  39. document.body.appendChild(this._loadingDiv);
  40. };
  41. var movebyName = function(nodeName) {
  42. var x = scene.getTransformNodeByName(nodeName);
  43. moveTrans(x);
  44. };
  45. var moveTrans = function(move_transformNode) {
  46. //alert(move_transformNode.name);
  47. if (movesingle == false) {
  48. movesingle = true;
  49. var tempstr = move_transformNode.name.replace("档案柜", "");
  50. var tempNum = parseInt(tempstr);
  51. if (move_transformNode.movex == "false") {
  52. for (var MoveNum = tempNum - 1; MoveNum >= 0; MoveNum--) {
  53. var tempNode = notmoveGroup[MoveNum];
  54. if (tempNode.movex == "false") {
  55. // console.log(tempNode.name);
  56. // console.log(tempNode.movex);
  57. const frameRate = 10;
  58. const xSlide = new BABYLON.Animation(
  59. "xSlide",
  60. "position.y",
  61. frameRate,
  62. BABYLON.Animation.ANIMATIONTYPE_FLOAT,
  63. BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT
  64. );
  65. const keyFrames = [];
  66. keyFrames.push({
  67. frame: 0,
  68. value: tempNode.position.y
  69. });
  70. keyFrames.push({
  71. frame: frameRate,
  72. value: tempNode.position.y - 653
  73. });
  74. xSlide.setKeys(keyFrames);
  75. tempNode.animations.push(xSlide);
  76. scene.beginAnimation(tempNode, 0, frameRate, false);
  77. //------------------------------------------------------------------------------
  78. thesprite = scene.spriteManagers[0].sprites[MoveNum];
  79. const frameRate1 = 10;
  80. var xSlide1 = new BABYLON.Animation(
  81. "xSlide1",
  82. "position.z",
  83. frameRate1,
  84. BABYLON.Animation.ANIMATIONTYPE_FLOAT,
  85. BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT
  86. );
  87. var keyFrames1 = [];
  88. keyFrames1.push({
  89. frame: 0,
  90. value: thesprite.position.z
  91. });
  92. keyFrames1.push({
  93. frame: frameRate1,
  94. value: thesprite.position.z - 1.7
  95. });
  96. xSlide1.setKeys(keyFrames1);
  97. thesprite.animations.push(xSlide1);
  98. scene.beginAnimation(thesprite, 0, frameRate1, false);
  99. tempNode.movex = "true";
  100. }
  101. }
  102. } else {
  103. for (var MoveNum = tempNum - 1; MoveNum <= 9; MoveNum++) {
  104. var tempNode = notmoveGroup[MoveNum];
  105. if (tempNode.movex == "true") {
  106. const frameRate = 10;
  107. const xSlide = new BABYLON.Animation(
  108. "xSlide",
  109. "position.y",
  110. frameRate,
  111. BABYLON.Animation.ANIMATIONTYPE_FLOAT,
  112. BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT
  113. );
  114. const keyFrames = [];
  115. keyFrames.push({
  116. frame: 0,
  117. value: tempNode.position.y
  118. });
  119. keyFrames.push({
  120. frame: frameRate,
  121. value: tempNode.position.y + 653
  122. });
  123. xSlide.setKeys(keyFrames);
  124. tempNode.animations.push(xSlide);
  125. scene.beginAnimation(tempNode, 0, frameRate, false);
  126. //------------------------------------------------------------------------------
  127. thesprite = scene.spriteManagers[0].sprites[MoveNum];
  128. const frameRate1 = 10;
  129. var xSlide1 = new BABYLON.Animation(
  130. "xSlide1",
  131. "position.z",
  132. frameRate1,
  133. BABYLON.Animation.ANIMATIONTYPE_FLOAT,
  134. BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT
  135. );
  136. var keyFrames1 = [];
  137. keyFrames1.push({
  138. frame: 0,
  139. value: thesprite.position.z
  140. });
  141. keyFrames1.push({
  142. frame: frameRate1,
  143. value: thesprite.position.z + 1.7
  144. });
  145. xSlide1.setKeys(keyFrames1);
  146. thesprite.animations.push(xSlide1);
  147. scene.beginAnimation(thesprite, 0, frameRate1, false);
  148. tempNode.movex = "false";
  149. }
  150. }
  151. }
  152. setTimeout(function() {
  153. movesingle = false;
  154. }, 2000);
  155. }
  156. };
  157. BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function() {
  158. show = 50;
  159. document.getElementById("customLoadingScreenDiv").style.display = "none";
  160. document.getElementById("customLoadingScreenDiv_first").style.display = "none";
  161. document.title = "档案库";
  162. //scene.getMaterialByName("材质.023").roughness = 0;
  163. notmoveGroup = [
  164. scene.getTransformNodeByName("档案柜01"),
  165. scene.getTransformNodeByName("档案柜02"),
  166. scene.getTransformNodeByName("档案柜03"),
  167. scene.getTransformNodeByName("档案柜04"),
  168. scene.getTransformNodeByName("档案柜05"),
  169. scene.getTransformNodeByName("档案柜06"),
  170. scene.getTransformNodeByName("档案柜07"),
  171. scene.getTransformNodeByName("档案柜08"),
  172. scene.getTransformNodeByName("档案柜09"),
  173. scene.getTransformNodeByName("档案柜10")
  174. ];
  175. notmoveGroup.forEach(function(item, index, arr) {
  176. if (item.name == "档案柜10") {
  177. item.movex = "NotMove"; //设置movex
  178. } else {
  179. item.movex = "false"; //设置movex
  180. }
  181. });
  182. var prepareGroupButtonOther = function(transformNodex, color) {
  183. var mesheses = null;
  184. if (transformNodex.getClassName() == "TransformNode") {
  185. mesheses = transformNodex.getChildMeshes(false);
  186. } else {
  187. mesheses = [];
  188. mesheses.push(transformNodex);
  189. }
  190. for (var i = 0; i < mesheses.length; i++) {
  191. mesheses[i].actionManager = new BABYLON.ActionManager(scene);
  192. var theScaling = mesheses[i].scaling;
  193. if (true) {
  194. try {
  195. // 初始化数据 温度/湿度
  196. deviceData.forEach(item => {
  197. if (item.id === transformNodex.nameID) {
  198. transformNodex.wendu = item.wendu;
  199. transformNodex.sidu = item.sidu;
  200. transformNodex.baojing = item.alarmState;
  201. }
  202. });
  203. //mesheses[i].actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOutTrigger, mesheses[i], "scaling", new BABYLON.Vector3(theScaling.x, theScaling.y, theScaling.z), 100));
  204. mesheses[i].actionManager.registerAction(
  205. new BABYLON.ExecuteCodeAction(
  206. {
  207. trigger: BABYLON.ActionManager.OnPointerOverTrigger,
  208. parameter: ""
  209. },
  210. function() {
  211. clickbegin = true;
  212. if (true) {
  213. try {
  214. if (oldtransformNodeOther != null) {
  215. oldtransformNodeOther.removeBehavior(drag);
  216. var mesheses2 = null;
  217. if (
  218. oldtransformNodeOther.getClassName() == "TransformNode"
  219. ) {
  220. mesheses2 = oldtransformNodeOther.getChildMeshes(false);
  221. } else {
  222. mesheses2 = [];
  223. mesheses2.push(oldtransformNodeOther);
  224. }
  225. for (var i = 0; i < mesheses2.length; i++) {
  226. try {
  227. h2.removeMesh(mesheses2[i]);
  228. } catch (error) {
  229. // alert(error)
  230. }
  231. }
  232. }
  233. oldtransformNodeOther = transformNodex;
  234. //transformNodex.addBehavior(drag);
  235. var mesheses3 = null;
  236. if (transformNodex.getClassName() == "TransformNode") {
  237. mesheses3 = transformNodex.getChildMeshes(false);
  238. } else {
  239. mesheses3 = [];
  240. mesheses3.push(transformNodex);
  241. }
  242. for (var i = 0; i < mesheses3.length; i++) {
  243. try {
  244. if (transformNodex.baojing == true) {
  245. h2.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  246. } else {
  247. h2.addMesh(mesheses3[i], color);
  248. }
  249. } catch (error) {
  250. // alert(error)
  251. }
  252. }
  253. } catch (error) {
  254. // alert(error)
  255. }
  256. clickbegin = false;
  257. }
  258. if (transformNodex.name.indexOf("yangan") >= 0) {
  259. PointerOverYangan = transformNodex.name;
  260. if (transformNodex.baojing == true) {
  261. var location = transformNodex.absolutePosition;
  262. var xd = scene.getMeshByName("tapred");
  263. // x = x-0.6;; y = y+0.3 z=z+0.5
  264. xd.position = new BABYLON.Vector3(
  265. location.x - 0.6,
  266. location.y + 0.9,
  267. location.z + 0.5
  268. );
  269. var font_size = 36;
  270. var font = "bold " + font_size + "px Arial";
  271. dynamicTexture3.drawText(
  272. transformNodex.wendu + "°C",
  273. null,
  274. null,
  275. font,
  276. "#FFFFFF",
  277. "#000000",
  278. true
  279. );
  280. dynamicTexture4.drawText(
  281. transformNodex.sidu + "%",
  282. null,
  283. null,
  284. font,
  285. "#FFFFFF",
  286. "#000000",
  287. true
  288. );
  289. if(transformNodex.canshow == true){
  290. xd.setEnabled(true);
  291. }
  292. } else {
  293. var location = transformNodex.absolutePosition;
  294. var xd = scene.getMeshByName("tapblue");
  295. // x = x-0.6;; y = y+0.3 z=z+0.5
  296. xd.position = new BABYLON.Vector3(
  297. location.x - 0.6,
  298. location.y + 0.9,
  299. location.z + 0.5
  300. );
  301. var font_size = 36;
  302. var font = "bold " + font_size + "px Arial";
  303. dynamicTexture.drawText(
  304. transformNodex.wendu + "°C",
  305. null,
  306. null,
  307. font,
  308. "#FFFFFF",
  309. "#000000",
  310. true
  311. );
  312. dynamicTexture2.drawText(
  313. transformNodex.sidu + "%",
  314. null,
  315. null,
  316. font,
  317. "#FFFFFF",
  318. "#000000",
  319. true
  320. );
  321. if(transformNodex.canshow == true){
  322. xd.setEnabled(true);
  323. }
  324. }
  325. }
  326. }
  327. )
  328. );
  329. mesheses[i].actionManager.registerAction(
  330. new BABYLON.ExecuteCodeAction(
  331. {
  332. trigger: BABYLON.ActionManager.OnPointerOutTrigger,
  333. parameter: ""
  334. },
  335. function() {
  336. var mesheses2 = null;
  337. if (transformNodex.getClassName() == "TransformNode") {
  338. mesheses2 = transformNodex.getChildMeshes(false);
  339. } else {
  340. mesheses2 = [];
  341. mesheses2.push(transformNodex);
  342. }
  343. for (var i = 0; i < mesheses2.length; i++) {
  344. try {
  345. h2.removeMesh(mesheses2[i]);
  346. } catch (error) {
  347. // alert(error)
  348. }
  349. }
  350. if (transformNodex.name.indexOf("yangan") >= 0) {
  351. if (transformNodex.baojing == true) {
  352. var location = transformNodex.absolutePosition;
  353. var xd = scene.getMeshByName("tapred");
  354. // x = x-0.6;; y = y+0.3 z=z+0.5
  355. xd.setEnabled(false);
  356. } else {
  357. var location = transformNodex.absolutePosition;
  358. var xd = scene.getMeshByName("tapblue");
  359. // x = x-0.6;; y = y+0.3 z=z+0.5
  360. xd.setEnabled(false);
  361. }
  362. }
  363. }
  364. )
  365. );
  366. //mesheses[i].actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOverTrigger, mesheses[i], "scaling", new BABYLON.Vector3(theScaling.x * 1.01, theScaling.y * 1.01, theScaling.z * 1.01), 100));
  367. } catch (error) {
  368. //alert(error)
  369. }
  370. }
  371. var clickbegin = false;
  372. mesheses[i].actionManager.registerAction(
  373. new BABYLON.ExecuteCodeAction(
  374. {
  375. trigger: BABYLON.ActionManager.OnPickTrigger,
  376. parameter: ""
  377. },
  378. function() {
  379. cameraClick(transformNodex);
  380. }
  381. )
  382. );
  383. }
  384. };
  385. var prepareGroupButton = function(transformNodex, color) {
  386. var mesheses = null;
  387. if (transformNodex.getClassName() == "TransformNode") {
  388. mesheses = transformNodex.getChildMeshes(false);
  389. } else {
  390. mesheses = [];
  391. mesheses.push(transformNodex);
  392. }
  393. for (var i = 0; i < mesheses.length; i++) {
  394. mesheses[i].actionManager = new BABYLON.ActionManager(scene);
  395. var theScaling = mesheses[i].scaling;
  396. if (true) {
  397. try {
  398. mesheses[i].actionManager.registerAction(
  399. new BABYLON.InterpolateValueAction(
  400. BABYLON.ActionManager.OnPointerOutTrigger,
  401. mesheses[i],
  402. "scaling",
  403. new BABYLON.Vector3(theScaling.x, theScaling.y, theScaling.z),
  404. 100
  405. )
  406. );
  407. mesheses[i].actionManager.registerAction(
  408. new BABYLON.InterpolateValueAction(
  409. BABYLON.ActionManager.OnPointerOverTrigger,
  410. mesheses[i],
  411. "scaling",
  412. new BABYLON.Vector3(
  413. theScaling.x * 1.01,
  414. theScaling.y * 1.01,
  415. theScaling.z * 1.01
  416. ),
  417. 100
  418. )
  419. );
  420. } catch (error) {
  421. //alert(error)
  422. }
  423. }
  424. var clickbegin = false;
  425. mesheses[i].actionManager.registerAction(
  426. new BABYLON.ExecuteCodeAction(
  427. {
  428. trigger: BABYLON.ActionManager.OnPickTrigger,
  429. parameter: ""
  430. },
  431. function() {
  432. clickbegin = true;
  433. if (true) {
  434. try {
  435. if (oldtransformNodex != null) {
  436. oldtransformNodex.removeBehavior(drag);
  437. var mesheses2 = null;
  438. if (oldtransformNodex.getClassName() == "TransformNode") {
  439. mesheses2 = oldtransformNodex.getChildMeshes(false);
  440. } else {
  441. mesheses2 = [];
  442. mesheses2.push(oldtransformNodex);
  443. }
  444. for (var i = 0; i < mesheses2.length; i++) {
  445. try {
  446. h1.removeMesh(mesheses2[i]);
  447. } catch (error) {
  448. // alert(error)
  449. }
  450. }
  451. }
  452. oldtransformNodex = transformNodex;
  453. //transformNodex.addBehavior(drag);
  454. var mesheses3 = null;
  455. if (transformNodex.getClassName() == "TransformNode") {
  456. mesheses3 = transformNodex.getChildMeshes(false);
  457. } else {
  458. mesheses3 = [];
  459. mesheses3.push(transformNodex);
  460. }
  461. for (var i = 0; i < mesheses3.length; i++) {
  462. try {
  463. h1.addMesh(mesheses3[i], BABYLON.Color3.White());
  464. } catch (error) {
  465. // alert(error)
  466. }
  467. }
  468. if (oldtransformNodex != null) {
  469. if (transformNodex.name == oldtransformNodex.name) {
  470. moveTrans(transformNodex);
  471. }
  472. }
  473. } catch (error) {
  474. // alert(error)
  475. }
  476. clickbegin = false;
  477. }
  478. }
  479. )
  480. );
  481. }
  482. };
  483. var dag1 = scene.getTransformNodeByName("档案柜01");
  484. var dag2 = scene.getTransformNodeByName("档案柜02");
  485. var dag3 = scene.getTransformNodeByName("档案柜03");
  486. var dag4 = scene.getTransformNodeByName("档案柜04");
  487. var dag5 = scene.getTransformNodeByName("档案柜05");
  488. var dag6 = scene.getTransformNodeByName("档案柜06");
  489. var dag7 = scene.getTransformNodeByName("档案柜07");
  490. var dag8 = scene.getTransformNodeByName("档案柜08");
  491. var dag9 = scene.getTransformNodeByName("档案柜09");
  492. var dag10 = scene.getTransformNodeByName("档案柜10");
  493. prepareGroupButton(dag1, BABYLON.Color3(1, 1, 0));
  494. prepareGroupButton(dag2, BABYLON.Color3(1, 1, 0));
  495. prepareGroupButton(dag3, BABYLON.Color3(1, 1, 0));
  496. prepareGroupButton(dag4, BABYLON.Color3(1, 1, 0));
  497. prepareGroupButton(dag5, BABYLON.Color3(1, 1, 0));
  498. prepareGroupButton(dag6, BABYLON.Color3(1, 1, 0));
  499. prepareGroupButton(dag7, BABYLON.Color3(1, 1, 0));
  500. prepareGroupButton(dag8, BABYLON.Color3(1, 1, 0));
  501. prepareGroupButton(dag9, BABYLON.Color3(1, 1, 0));
  502. prepareGroupButton(dag10, BABYLON.Color3(1, 1, 0));
  503. //test
  504. var camera01 = scene.getTransformNodeByName("camera01");
  505. camera01.nameID = "DAK_MO_CAM_001";
  506. var camera02 = scene.getTransformNodeByName("camera02");
  507. camera02.nameID = "DAK_MO_CAM_002";
  508. var camera03 = scene.getTransformNodeByName("camera03");
  509. camera03.nameID = "DAK_MO_CAM_003";
  510. var camera04 = scene.getTransformNodeByName("camera04");
  511. camera04.nameID = "DAK_MO_CAM_004";
  512. camera01.baojing = false;
  513. camera02.baojing = false;
  514. camera03.baojing = false;
  515. camera04.baojing = false;
  516. var yangan01 = scene.getTransformNodeByName("yangan01");
  517. yangan01.nameID = "DAK_MO_OAO_001";
  518. var yangan02 = scene.getTransformNodeByName("yangan02");
  519. yangan02.nameID = "DAK_MO_OAO_002";
  520. var yangan03 = scene.getTransformNodeByName("yangan03");
  521. yangan03.nameID = "DAK_MO_OAO_003";
  522. var yangan04 = scene.getTransformNodeByName("yangan04");
  523. yangan04.nameID = "DAK_MO_OAO_004";
  524. yangan01.baojing = false;
  525. yangan02.baojing = false;
  526. yangan03.baojing = false;
  527. yangan04.baojing = false;
  528. yangan01.canshow = true;
  529. yangan02.canshow = true;
  530. yangan03.canshow = true;
  531. yangan04.canshow = true;
  532. yangan01.wendu = 0;
  533. yangan01.sidu = 0;
  534. yangan02.wendu = 0;
  535. yangan02.sidu = 0;
  536. yangan03.wendu = 0;
  537. yangan03.sidu = 0;
  538. yangan04.wendu = 0;
  539. yangan04.sidu = 0;
  540. prepareGroupButtonOther(camera01, new BABYLON.Color3(0, 0, 1));
  541. prepareGroupButtonOther(camera02, new BABYLON.Color3(0, 0, 1));
  542. prepareGroupButtonOther(camera03, new BABYLON.Color3(0, 0, 1));
  543. prepareGroupButtonOther(camera04, new BABYLON.Color3(0, 0, 1));
  544. prepareGroupButtonOther(yangan01, new BABYLON.Color3(0, 0, 1));
  545. prepareGroupButtonOther(yangan02, new BABYLON.Color3(0, 0, 1));
  546. prepareGroupButtonOther(yangan03, new BABYLON.Color3(0, 0, 1));
  547. prepareGroupButtonOther(yangan04, new BABYLON.Color3(0, 0, 1));
  548. var x = scene.getMeshByName("档案架01_primitive0");
  549. x.overlayColor = BABYLON.Color3.White();
  550. x.renderOverlay = true;
  551. x = scene.getMeshByName("档案架02_primitive0");
  552. x.overlayColor = BABYLON.Color3.White();
  553. x.renderOverlay = true;
  554. x = scene.getMeshByName("档案架03_primitive0");
  555. x.overlayColor = BABYLON.Color3.White();
  556. x.renderOverlay = true;
  557. x = scene.getMeshByName("档案架04_primitive0");
  558. x.overlayColor = BABYLON.Color3.White();
  559. x.renderOverlay = true;
  560. x = scene.getMeshByName("档案架05_primitive0");
  561. x.overlayColor = BABYLON.Color3.White();
  562. x.renderOverlay = true;
  563. x = scene.getMeshByName("档案架06_primitive0");
  564. x.overlayColor = BABYLON.Color3.White();
  565. x.renderOverlay = true;
  566. x = scene.getMeshByName("档案架07_primitive0");
  567. x.overlayColor = BABYLON.Color3.White();
  568. x.renderOverlay = true;
  569. x = scene.getMeshByName("档案架08_primitive0");
  570. x.overlayColor = BABYLON.Color3.White();
  571. x.renderOverlay = true;
  572. x = scene.getMeshByName("档案架09_primitive0");
  573. x.overlayColor = BABYLON.Color3.White();
  574. x.renderOverlay = true;
  575. x = scene.getMeshByName("档案架10_primitive0");
  576. x.overlayColor = BABYLON.Color3.White();
  577. x.renderOverlay = true;
  578. x = scene.getMeshByName("前门01_primitive0");
  579. x.overlayColor = BABYLON.Color3.White();
  580. x.renderOverlay = true;
  581. x = scene.getMeshByName("后门01_primitive0");
  582. x.overlayColor = BABYLON.Color3.White();
  583. x.renderOverlay = true;
  584. // x = scene.getMeshByName("墙体");
  585. // x.overlayColor = BABYLON.Color3.White();
  586. // x.renderOverlay = true;
  587. //修改贴图
  588. var bluexMat = new BABYLON.PBRMaterial("bluex", scene);
  589. var tempddxa = new BABYLON.Texture("./asset/blue.png", scene);
  590. var tempddxb = new BABYLON.Texture("./asset/blue.png", scene);
  591. tempddxa.hasAlpha = true;
  592. tempddxa.hasAlpha = true;
  593. tempddxa.uAng = (180 * Math.PI) / 180;
  594. tempddxb.uAng = (180 * Math.PI) / 180;
  595. bluexMat.useAlphaFromAlbedoTexture = true;
  596. bluexMat.albedoTexture = tempddxa;
  597. bluexMat.reflectionColor = new BABYLON.Color3(0, 0, 0);
  598. bluexMat.lightmapTexture = tempddxb;
  599. scene.getMeshByName("平面_1").material = bluexMat;
  600. var redMat = new BABYLON.PBRMaterial("redMat", scene);
  601. var tempddx2 = new BABYLON.Texture("./asset/red.png", scene);
  602. var tempddx3 = new BABYLON.Texture("./asset/red.png", scene);
  603. tempddx2.hasAlpha = true;
  604. tempddx3.hasAlpha = true;
  605. tempddx2.uAng = (180 * Math.PI) / 180;
  606. tempddx3.uAng = (180 * Math.PI) / 180;
  607. redMat.useAlphaFromAlbedoTexture = true;
  608. redMat.reflectionColor = new BABYLON.Color3(0, 0, 0);
  609. //redMat.emissiveTexture =tempddx2;
  610. redMat.albedoTexture = tempddx2;
  611. redMat.lightmapTexture = tempddx3;
  612. scene.getMeshByName("平面_1_2").material = redMat;
  613. //平面2
  614. //Set font
  615. var font_size = 48;
  616. var font = "bold " + font_size + "px Arial";
  617. //Set height for plane
  618. var planeHeight = 3;
  619. //Set height for dynamic texture
  620. var DTHeight = 1.5 * font_size; //or set as wished
  621. //Calcultae ratio
  622. var ratio = planeHeight / DTHeight;
  623. //Set text
  624. var text = "10";
  625. //Use a temporay dynamic texture to calculate the length of the text on the dynamic texture canvas
  626. var temp = new BABYLON.DynamicTexture("DynamicTexture", 64, scene);
  627. var tmpctx = temp.getContext();
  628. tmpctx.font = font;
  629. var DTWidth = tmpctx.measureText(text).width + 58;
  630. //Calculate width the plane has to be
  631. var planeWidth = DTWidth * ratio;
  632. //Create dynamic texture and write the text
  633. dynamicTexture = new BABYLON.DynamicTexture(
  634. "DynamicTexture",
  635. { width: DTWidth, height: DTHeight },
  636. scene,
  637. false
  638. );
  639. var mat = new BABYLON.StandardMaterial("mat", scene);
  640. //var mat = new BABYLON.PBRMaterial("mat", scene);
  641. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  642. mat.disableLighting = true;
  643. mat.emissiveTexture = dynamicTexture;
  644. // mat.alpha = 0.75;
  645. // mat.alphaMode = 6;
  646. // mat.diffuseColor = new BABYLON.Color3(0, 0, 0);
  647. mat.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  648. dynamicTexture.uAng = (166.39 * Math.PI) / 180;
  649. //Create plane and set dynamic texture as material
  650. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  651. var vxd = scene.getMeshByName("平面_2"); //blue
  652. vxd.material = mat;
  653. //平面3
  654. dynamicTexture2 = new BABYLON.DynamicTexture(
  655. "DynamicTexture2",
  656. { width: DTWidth, height: DTHeight },
  657. scene,
  658. false
  659. );
  660. //var mat = new BABYLON.StandardMaterial("mat", scene);
  661. //mat.disableLighting = true;
  662. var mat2 = new BABYLON.StandardMaterial("mat2", scene);
  663. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  664. mat2.disableLighting = true;
  665. //mat2.ambientTexture = dynamicTexture2;
  666. mat2.emissiveTexture = dynamicTexture2;
  667. // mat2.alpha = 0.75;
  668. // mat2.alphaMode=6;
  669. // mat2.diffuseColor = new BABYLON.Color3(0, 0, 0);
  670. mat2.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  671. dynamicTexture2.uAng = (166.39 * Math.PI) / 180;
  672. //Create plane and set dynamic texture as material
  673. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  674. var vxd2 = scene.getMeshByName("平面_3");
  675. vxd2.material = mat2;
  676. //-------------------------------------------------------------------------------------
  677. dynamicTexture3 = new BABYLON.DynamicTexture(
  678. "DynamicTexture3",
  679. { width: DTWidth, height: DTHeight },
  680. scene,
  681. false
  682. );
  683. //var mat = new BABYLON.StandardMaterial("mat", scene);
  684. //mat.disableLighting = true;
  685. var mat3 = new BABYLON.StandardMaterial("mat3", scene);
  686. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  687. mat3.disableLighting = true;
  688. //mat2.ambientTexture = dynamicTexture2;
  689. mat3.emissiveTexture = dynamicTexture3;
  690. // mat3.alpha = 0.75;
  691. // mat3.alphaMode=6;
  692. // mat3.diffuseColor = new BABYLON.Color3(0, 0, 0);
  693. mat3.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  694. dynamicTexture3.uAng = (166.39 * Math.PI) / 180;
  695. //Create plane and set dynamic texture as material
  696. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  697. var vxd3 = scene.getMeshByName("平面_2_2"); //blue
  698. vxd3.material = mat3;
  699. //-------------------------------------------------------------------------------------
  700. dynamicTexture4 = new BABYLON.DynamicTexture(
  701. "dynamicTexture4",
  702. { width: DTWidth, height: DTHeight },
  703. scene,
  704. false
  705. );
  706. //var mat = new BABYLON.StandardMaterial("mat", scene);
  707. //mat.disableLighting = true;
  708. var mat4 = new BABYLON.StandardMaterial("mat4", scene);
  709. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  710. mat4.disableLighting = true;
  711. //mat2.ambientTexture = dynamicTexture2;
  712. mat4.emissiveTexture = dynamicTexture4;
  713. // mat4.alpha = 0.75;
  714. // mat4.alphaMode=6;
  715. // mat4.diffuseColor = new BABYLON.Color3(0, 0, 0);
  716. mat4.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  717. dynamicTexture4.uAng = (166.39 * Math.PI) / 180;
  718. //Create plane and set dynamic texture as material
  719. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  720. var vxd4 = scene.getMeshByName("平面_3_2");
  721. vxd4.material = mat4;
  722. scene.getMeshByName("tapblue").setEnabled(false);
  723. scene.getMeshByName("tapred").setEnabled(false);
  724. var light = new BABYLON.HemisphericLight(
  725. "HemiLight",
  726. new BABYLON.Vector3(0, 1, 0),
  727. scene
  728. );
  729. light.intensity = 2;
  730. light.diffuse = new BABYLON.Color3(0.92, 0.92, 0.92);
  731. var material1 = scene.getMaterialByName("材质.075");
  732. material1.albedoColor = new BABYLON.Color3(160 / 255, 160 / 255, 160 / 255);
  733. material1.roughness = 1;
  734. //地
  735. var material2 = scene.getMaterialByName("材质.074");
  736. material2.metallic = 0.52;
  737. material2.roughness = 0;
  738. //material2.metallicReflectanceColor=new BABYLON.Color3(1,0,0);
  739. material2.albedoColor = new BABYLON.Color3(0.8, 0.8, 0.8);
  740. var material3 = scene.getMaterialByName("材质.084");
  741. material3.emissiveColor = new BABYLON.Color3(0.278, 0.278, 0.278);
  742. material3.metallic = 0.87;
  743. material3.roughness = 0;
  744. scene.getMeshByName("档案架10_primitive3").material = scene.getMaterialByName("01.004");
  745. scene.getMeshByName("档案架09_primitive4").material = scene.getMaterialByName("02.004");
  746. scene.getMeshByName("档案架08_primitive4").material = scene.getMaterialByName("03.004");
  747. scene.getMeshByName("档案架07_primitive4").material = scene.getMaterialByName("04.004");
  748. scene.getMeshByName("档案架06_primitive4").material = scene.getMaterialByName("05.004");
  749. scene.getMeshByName("档案架06_primitive4").material = scene.getMaterialByName("06.004");
  750. scene.getMeshByName("档案架04_primitive4").material = scene.getMaterialByName("07.004");
  751. scene.getMeshByName("档案架03_primitive4").material = scene.getMaterialByName("08.004");
  752. scene.getMeshByName("档案架02_primitive4").material = scene.getMaterialByName("09.004");
  753. scene.getMeshByName("档案架01_primitive3").material = scene.getMaterialByName("10.004");
  754. // 还原到10列,注释掉下面代码
  755. // scene.getTransformNodeByName("档案柜01").setEnabled(false);
  756. // scene.getTransformNodeByName("档案柜02").setEnabled(false);
  757. // var v1 = scene.getMeshByName("钢轨01");
  758. // v1.position = new BABYLON.Vector3(v1.position.x,60.0,v1.position.z);
  759. // v1.scaling = new BABYLON.Vector3(1,0.9,1);
  760. var v2 = scene.getTransformNodeByName("后门01");
  761. v2.setParent( scene.getTransformNodeByName("档案柜03"),true);
  762. v2.position = new BABYLON.Vector3(v2.position.x,-122.479,v2.position.z);
  763. // player_balloon_js1.isVisible = false;
  764. // player_balloon_js2.isVisible = false;
  765. // 给vue页面传值,加载完成之后
  766. parent.getIframeLoading("false")
  767. };
  768. // createScene function that creates and return the scene
  769. var createScene = function() {
  770. engine.displayLoadingUI();
  771. // create a basic BJS Scene object
  772. var scene = new BABYLON.Scene(engine);
  773. // scene.debugLayer.show();
  774. var camera = new BABYLON.ArcRotateCamera(
  775. "Camera",
  776. 0,
  777. 0,
  778. 5,
  779. new BABYLON.Vector3(0, -1, 0),
  780. scene
  781. );
  782. camera.setTarget(new BABYLON.Vector3(0, 2, 0));
  783. camera.attachControl(canvas, true);
  784. camera.lowerRadiusLimit = 2.0; // 这里是最大的位置,值越大,物体越小
  785. camera.upperRadiusLimit = 40;
  786. camera.radius = 10.48;
  787. camera.alpha = (Math.PI * -211.4) / 180;
  788. camera.beta = (Math.PI * 66) / 180;
  789. camera.inertia = 0.1; // 缩放的快慢
  790. camera.useAutoRotationBehavior = true; // 自动旋转
  791. camera.panningDistanceLimit = 2; //平移半径
  792. camera.panningInertia = 0;
  793. camera.autoTransitionRange = 1;
  794. camera.pinchToPanMaxDistance = 0.1;
  795. camera.pinchDeltaPercentage = 0.001;
  796. camera.useAutoRotationBehavior = false;
  797. scene.activeCamera = camera;
  798. // 改变场景背景颜色 - 背景颜色opacity值设为0,达到透明背景的效果
  799. scene.clearColor = new BABYLON.Color4(0, 0, 0, 0);
  800. scene.activeCamera.useInputToRestoreState = true;
  801. var camera1_status = scene.activeCamera.storeState();
  802. var assetsManager = new BABYLON.AssetsManager(scene);
  803. var meshTask = assetsManager.addMeshTask(
  804. "skull task",
  805. "",
  806. "asset/",
  807. "mjj.glb"
  808. );
  809. meshTask.onSuccess = function(task) {
  810. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.2, 0.2, -0.2);
  811. task.loadedMeshes[0].position = new BABYLON.Vector3(0.0, 2, 0);
  812. };
  813. meshTask.onError = function(task, message, exception) {
  814. console.log(message, exception);
  815. };
  816. /*var meshTask_tap = assetsManager.addMeshTask("skull task", "", "asset/", "tapx.glb");
  817. meshTask_tap.onSuccess = function (task) {
  818. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.2, 0.2, -0.2);
  819. task.loadedMeshes[0].position = new BABYLON.Vector3(-1.929, 4.029, 0.968);
  820. //-2.5,3.77,1.45
  821. // x = x-0.6;; y = y+0.3 z=z+0.5
  822. task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
  823. task.loadedMeshes[0].name = "test";
  824. var vx = scene.getTransformNodeByName("空白_2_2");
  825. vx.position = new BABYLON.Vector3(0, 0, 0);
  826. vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
  827. }
  828. meshTask_tap.onError = function (task, message, exception) {
  829. console.log(message, exception);
  830. }*/
  831. var meshTask_tapblue = assetsManager.addMeshTask(
  832. "skull task",
  833. "",
  834. "asset/",
  835. "tapBlue.glb"
  836. );
  837. meshTask_tapblue.onSuccess = function(task) {
  838. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.2, 0.2, -0.2);
  839. task.loadedMeshes[0].position = new BABYLON.Vector3(0, 0, 0);
  840. //-2.5,3.77,1.45
  841. // x = x-0.6;; y = y+0.3 z=z+0.5
  842. task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
  843. task.loadedMeshes[0].name = "tapblue";
  844. var vx = scene.getTransformNodeByName("蓝");
  845. vx.position = new BABYLON.Vector3(0, 0, 0);
  846. vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
  847. vx.scaling = new BABYLON.Vector3(0.015, 0.015, 0.015);
  848. };
  849. meshTask_tapblue.onError = function(task, message, exception) {
  850. console.log(message, exception);
  851. };
  852. var meshTask_tapred = assetsManager.addMeshTask(
  853. "skull task",
  854. "",
  855. "asset/",
  856. "tapRed.glb"
  857. );
  858. meshTask_tapred.onSuccess = function(task) {
  859. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.2, 0.2, -0.2);
  860. task.loadedMeshes[0].position = new BABYLON.Vector3(-1.929, 4.029, 0.968);
  861. //-2.5,3.77,1.45
  862. // x = x-0.6;; y = y+0.3 z=z+0.5
  863. task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
  864. task.loadedMeshes[0].name = "tapred";
  865. var vx = scene.getTransformNodeByName("红");
  866. vx.position = new BABYLON.Vector3(0, 0, 0);
  867. vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
  868. vx.scaling = new BABYLON.Vector3(0.015, 0.015, 0.015);
  869. };
  870. meshTask_tapred.onError = function(task, message, exception) {
  871. console.log(message, exception);
  872. };
  873. var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData(
  874. "textures/environmentSpecular.env",
  875. scene
  876. );
  877. //var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData("textures/environment2.env", scene);
  878. scene.environmentTexture = hdrTexture;
  879. var spriteManagerPlayer = new BABYLON.SpriteManager(
  880. "playerManager",
  881. "./img/bl9.png",
  882. 10,
  883. {
  884. width: 100,
  885. height: 100
  886. },
  887. scene
  888. );
  889. //spriteManagerPlayer.renderingGroupId = 2;
  890. spriteManagerPlayer.isPickable = true;
  891. //1
  892. player_balloon_js1 = new BABYLON.Sprite(
  893. "player_balloon_js1",
  894. spriteManagerPlayer
  895. );
  896. player_balloon_js1.size = 0.1;
  897. player_balloon_js1.name = "10";
  898. player_balloon_js1.nameID = "cabinet10";
  899. player_balloon_js1.cellIndex = 0;
  900. player_balloon_js1.position = new BABYLON.Vector3(-2.5, 3.5, -0.72);
  901. player_balloon_js1.isPickable = true;
  902. player_balloon_js1.width = 0.2;
  903. player_balloon_js1.height = 0.2;
  904. player_balloon_js1.playAnimation(0, 6, true, 200);
  905. //2
  906. player_balloon_js2 = new BABYLON.Sprite(
  907. "player_balloon_js2",
  908. spriteManagerPlayer
  909. );
  910. player_balloon_js2.size = 0.1;
  911. player_balloon_js2.name = "9";
  912. player_balloon_js2.nameID = "cabinet09";
  913. player_balloon_js2.cellIndex = 0;
  914. player_balloon_js2.position = new BABYLON.Vector3(-2.5, 3.5, -0.38);
  915. player_balloon_js2.isPickable = true;
  916. player_balloon_js2.width = 0.2;
  917. player_balloon_js2.height = 0.2;
  918. player_balloon_js2.playAnimation(0, 6, true, 200);
  919. //3
  920. player_balloon_js3 = new BABYLON.Sprite(
  921. "player_balloon_js3",
  922. spriteManagerPlayer
  923. );
  924. player_balloon_js3.size = 0.1;
  925. player_balloon_js3.name = "8";
  926. player_balloon_js3.nameID = "cabinet08";
  927. player_balloon_js3.cellIndex = 0;
  928. player_balloon_js3.position = new BABYLON.Vector3(-2.5, 3.5, -0.03);
  929. player_balloon_js3.isPickable = true;
  930. player_balloon_js3.width = 0.2;
  931. player_balloon_js3.height = 0.2;
  932. player_balloon_js3.playAnimation(0, 6, true, 200);
  933. //4
  934. player_balloon_js4 = new BABYLON.Sprite(
  935. "player_balloon_js4",
  936. spriteManagerPlayer
  937. );
  938. player_balloon_js4.size = 0.1;
  939. player_balloon_js4.name = "7";
  940. player_balloon_js4.nameID = "cabinet07";
  941. player_balloon_js4.cellIndex = 0;
  942. player_balloon_js4.position = new BABYLON.Vector3(-2.5, 3.5, 0.3);
  943. player_balloon_js4.isPickable = true;
  944. player_balloon_js4.width = 0.2;
  945. player_balloon_js4.height = 0.2;
  946. player_balloon_js4.playAnimation(0, 6, true, 200);
  947. //5
  948. player_balloon_js5 = new BABYLON.Sprite(
  949. "player_balloon_js5",
  950. spriteManagerPlayer
  951. );
  952. player_balloon_js5.size = 0.1;
  953. player_balloon_js5.name = "6";
  954. player_balloon_js5.nameID = "cabinet06";
  955. player_balloon_js5.cellIndex = 0;
  956. player_balloon_js5.position = new BABYLON.Vector3(-2.5, 3.5, 0.64);
  957. player_balloon_js5.isPickable = true;
  958. player_balloon_js5.width = 0.2;
  959. player_balloon_js5.height = 0.2;
  960. player_balloon_js5.playAnimation(0, 6, true, 200);
  961. //6
  962. player_balloon_js6 = new BABYLON.Sprite(
  963. "player_balloon_js6",
  964. spriteManagerPlayer
  965. );
  966. player_balloon_js6.size = 0.1;
  967. player_balloon_js6.name = "5";
  968. player_balloon_js6.nameID = "cabinet05";
  969. player_balloon_js6.cellIndex = 0;
  970. player_balloon_js6.position = new BABYLON.Vector3(-2.5, 3.5, 0.98);
  971. player_balloon_js6.isPickable = true;
  972. player_balloon_js6.width = 0.2;
  973. player_balloon_js6.height = 0.2;
  974. player_balloon_js6.playAnimation(0, 6, true, 200);
  975. //7
  976. player_balloon_js7 = new BABYLON.Sprite(
  977. "player_balloon_js7",
  978. spriteManagerPlayer
  979. );
  980. player_balloon_js7.size = 0.1;
  981. player_balloon_js7.name = "4";
  982. player_balloon_js7.nameID = "cabinet04";
  983. player_balloon_js7.cellIndex = 0;
  984. player_balloon_js7.position = new BABYLON.Vector3(-2.5, 3.5, 1.32);
  985. player_balloon_js7.isPickable = true;
  986. player_balloon_js7.width = 0.2;
  987. player_balloon_js7.height = 0.2;
  988. player_balloon_js7.playAnimation(0, 6, true, 200);
  989. //8
  990. player_balloon_js8 = new BABYLON.Sprite(
  991. "player_balloon_js8",
  992. spriteManagerPlayer
  993. );
  994. player_balloon_js8.size = 0.1;
  995. player_balloon_js8.name = "3";
  996. player_balloon_js8.nameID = "cabinet03";
  997. player_balloon_js8.cellIndex = 0;
  998. player_balloon_js8.position = new BABYLON.Vector3(-2.5, 3.5, 1.66);
  999. player_balloon_js8.isPickable = true;
  1000. player_balloon_js8.width = 0.2;
  1001. player_balloon_js8.height = 0.2;
  1002. player_balloon_js8.playAnimation(0, 6, true, 200);
  1003. //9
  1004. player_balloon_js9 = new BABYLON.Sprite(
  1005. "player_balloon_js",
  1006. spriteManagerPlayer
  1007. );
  1008. player_balloon_js9.size = 0.1;
  1009. player_balloon_js9.name = "2";
  1010. player_balloon_js9.nameID = "cabinet02";
  1011. player_balloon_js9.cellIndex = 0;
  1012. player_balloon_js9.position = new BABYLON.Vector3(-2.5, 3.5, 2);
  1013. //-2.3895861905112934, 3.402393519214794, z: 0.3225995832152506
  1014. player_balloon_js9.isPickable = true;
  1015. player_balloon_js9.width = 0.2;
  1016. player_balloon_js9.height = 0.2;
  1017. player_balloon_js9.playAnimation(0, 6, true, 200);
  1018. //10
  1019. player_balloon_js10 = new BABYLON.Sprite(
  1020. "player_balloon_js10",
  1021. spriteManagerPlayer
  1022. );
  1023. player_balloon_js10.size = 0.1;
  1024. player_balloon_js10.name = "1";
  1025. player_balloon_js10.nameID = "cabinet01";
  1026. player_balloon_js10.cellIndex = 0;
  1027. player_balloon_js10.position = new BABYLON.Vector3(-2.5, 3.5, 2.33);
  1028. player_balloon_js10.isPickable = true;
  1029. player_balloon_js10.width = 0.2;
  1030. player_balloon_js10.height = 0.2;
  1031. player_balloon_js10.playAnimation(0, 6, true, 200);
  1032. scene.onPointerDown = function(evt) {
  1033. var pickResult = scene.pickSprite(this.pointerX, this.pointerY);
  1034. var pick = scene.pick(scene.pointerX, scene.pointerY);
  1035. console.log(pick.pickedPoint);
  1036. if (pickResult.pickedSprite != null) {
  1037. if (pickResult.hit) {
  1038. cabinetClick(pickResult.pickedSprite);
  1039. }
  1040. }
  1041. };
  1042. // renderCanvas.style.backgroundImage = 'url("./textures/' + '4' + '.jpg")';
  1043. assetsManager.load();
  1044. drag = new BABYLON.PointerDragBehavior({
  1045. dragPlaneNormal: new BABYLON.Vector3(0, 0, 1)
  1046. });
  1047. //drag.useObjectOrienationForDragging = false;
  1048. drag.validateDrag = targetPosition => {
  1049. console.log(targetPosition);
  1050. if (targetPosition.x > 10.5 || targetPosition.x < -10.5) {
  1051. return false;
  1052. }
  1053. if (targetPosition.z > 10.5 || targetPosition.z < -10.5) {
  1054. return false;
  1055. }
  1056. if (oldtransformNodex != null) {
  1057. return true;
  1058. }
  1059. };
  1060. drag.onDragEndObservable.add(event => {
  1061. console.log("dragEnd");
  1062. //console.log(event);
  1063. //console.log(line03_position)
  1064. });
  1065. //GUI
  1066. h1 = new BABYLON.HighlightLayer("hl1", scene);
  1067. h2 = new BABYLON.HighlightLayer("hl2", scene);
  1068. h3 = new BABYLON.HighlightLayer("hl3", scene);
  1069. var step = 0.1;
  1070. var currentx = 1;
  1071. var step2 = 0.1;
  1072. var currentx2 = 0.1;
  1073. h1.blurHorizontalSize = 0.1;
  1074. var showx = 0;
  1075. var showx2 = 2;
  1076. scene.registerAfterRender(() => {
  1077. h1.blurHorizontalSize = h1.blurVerticalSize + currentx;
  1078. h2.blurHorizontalSize = h2.blurVerticalSize + currentx2;
  1079. h3.blurHorizontalSize = h3.blurVerticalSize + currentx2;
  1080. var nodealert = scene.getTransformNodeByName("yangan01");
  1081. if (nodealert != null) {
  1082. var mesheses3 = null;
  1083. if (nodealert.getClassName() == "TransformNode") {
  1084. mesheses3 = nodealert.getChildMeshes(false);
  1085. } else {
  1086. mesheses3 = [];
  1087. mesheses3.push(nodealert);
  1088. }
  1089. for (var i = 0; i < mesheses3.length; i++) {
  1090. try {
  1091. if (nodealert.baojing == true) {
  1092. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1093. } else {
  1094. h3.removeMesh(mesheses3[i]);
  1095. }
  1096. } catch (error) {
  1097. // alert(error)
  1098. }
  1099. }
  1100. }
  1101. var nodealert = scene.getTransformNodeByName("yangan02");
  1102. if (nodealert != null) {
  1103. var mesheses3 = null;
  1104. if (nodealert.getClassName() == "TransformNode") {
  1105. mesheses3 = nodealert.getChildMeshes(false);
  1106. } else {
  1107. mesheses3 = [];
  1108. mesheses3.push(nodealert);
  1109. }
  1110. for (var i = 0; i < mesheses3.length; i++) {
  1111. try {
  1112. if (nodealert.baojing == true) {
  1113. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1114. } else {
  1115. h3.removeMesh(mesheses3[i]);
  1116. }
  1117. } catch (error) {
  1118. // alert(error)
  1119. }
  1120. }
  1121. }
  1122. var nodealert = scene.getTransformNodeByName("yangan03");
  1123. if (nodealert != null) {
  1124. var mesheses3 = null;
  1125. if (nodealert.getClassName() == "TransformNode") {
  1126. mesheses3 = nodealert.getChildMeshes(false);
  1127. } else {
  1128. mesheses3 = [];
  1129. mesheses3.push(nodealert);
  1130. }
  1131. for (var i = 0; i < mesheses3.length; i++) {
  1132. try {
  1133. if (nodealert.baojing == true) {
  1134. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1135. } else {
  1136. h3.removeMesh(mesheses3[i]);
  1137. }
  1138. } catch (error) {
  1139. // alert(error)
  1140. }
  1141. }
  1142. }
  1143. var nodealert = scene.getTransformNodeByName("yangan04");
  1144. if (nodealert != null) {
  1145. var mesheses3 = null;
  1146. if (nodealert.getClassName() == "TransformNode") {
  1147. mesheses3 = nodealert.getChildMeshes(false);
  1148. } else {
  1149. mesheses3 = [];
  1150. mesheses3.push(nodealert);
  1151. }
  1152. for (var i = 0; i < mesheses3.length; i++) {
  1153. try {
  1154. if (nodealert.baojing == true) {
  1155. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1156. } else {
  1157. h3.removeMesh(mesheses3[i]);
  1158. }
  1159. } catch (error) {
  1160. // alert(error)
  1161. }
  1162. }
  1163. }
  1164. var nodealert = scene.getTransformNodeByName("camera01");
  1165. if (nodealert != null) {
  1166. var mesheses3 = null;
  1167. if (nodealert.getClassName() == "TransformNode") {
  1168. mesheses3 = nodealert.getChildMeshes(false);
  1169. } else {
  1170. mesheses3 = [];
  1171. mesheses3.push(nodealert);
  1172. }
  1173. for (var i = 0; i < mesheses3.length; i++) {
  1174. try {
  1175. if (nodealert.baojing == true) {
  1176. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1177. } else {
  1178. h3.removeMesh(mesheses3[i]);
  1179. }
  1180. } catch (error) {
  1181. // alert(error)
  1182. }
  1183. }
  1184. }
  1185. var nodealert = scene.getTransformNodeByName("camera02");
  1186. if (nodealert != null) {
  1187. var mesheses3 = null;
  1188. if (nodealert.getClassName() == "TransformNode") {
  1189. mesheses3 = nodealert.getChildMeshes(false);
  1190. } else {
  1191. mesheses3 = [];
  1192. mesheses3.push(nodealert);
  1193. }
  1194. for (var i = 0; i < mesheses3.length; i++) {
  1195. try {
  1196. if (nodealert.baojing == true) {
  1197. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1198. } else {
  1199. h3.removeMesh(mesheses3[i]);
  1200. }
  1201. } catch (error) {
  1202. // alert(error)
  1203. }
  1204. }
  1205. }
  1206. var nodealert = scene.getTransformNodeByName("camera03");
  1207. if (nodealert != null) {
  1208. var mesheses3 = null;
  1209. if (nodealert.getClassName() == "TransformNode") {
  1210. mesheses3 = nodealert.getChildMeshes(false);
  1211. } else {
  1212. mesheses3 = [];
  1213. mesheses3.push(nodealert);
  1214. }
  1215. for (var i = 0; i < mesheses3.length; i++) {
  1216. try {
  1217. if (nodealert.baojing == true) {
  1218. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1219. } else {
  1220. h3.removeMesh(mesheses3[i]);
  1221. }
  1222. } catch (error) {
  1223. // alert(error)
  1224. }
  1225. }
  1226. }
  1227. var nodealert = scene.getTransformNodeByName("camera04");
  1228. if (nodealert != null) {
  1229. var mesheses3 = null;
  1230. if (nodealert.getClassName() == "TransformNode") {
  1231. mesheses3 = nodealert.getChildMeshes(false);
  1232. } else {
  1233. mesheses3 = [];
  1234. mesheses3.push(nodealert);
  1235. }
  1236. for (var i = 0; i < mesheses3.length; i++) {
  1237. try {
  1238. if (nodealert.baojing == true) {
  1239. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  1240. } else {
  1241. h3.removeMesh(mesheses3[i]);
  1242. }
  1243. } catch (error) {
  1244. // alert(error)
  1245. }
  1246. }
  1247. }
  1248. var a = scene.getMaterialByName("carpaint_baseRed");
  1249. if (a != null) {
  1250. if (a.albedoColor == b) {
  1251. b = new BABYLON.Color3(0, 1, 0);
  1252. a.albedoColor = b;
  1253. }
  1254. }
  1255. var v2 = scene.getMeshByName("tapblue");
  1256. if (v2 != null) {
  1257. v2.lookAt(camera.globalPosition, 0, 0, Math.PI);
  1258. }
  1259. var v3 = scene.getMeshByName("tapred");
  1260. if (v3 != null) {
  1261. v3.lookAt(camera.globalPosition, 0, 0, Math.PI);
  1262. }
  1263. if (currentx > 0.5) {
  1264. step *= -1;
  1265. }
  1266. if (currentx < 0) {
  1267. step *= -1;
  1268. }
  1269. currentx += step;
  1270. if (currentx2 > 5) {
  1271. step2 *= -1;
  1272. }
  1273. if (currentx2 < 0) {
  1274. step2 *= -1;
  1275. }
  1276. currentx2 += step2;
  1277. if (dynamicTexture != null && PointerOverYangan != null) {
  1278. var textx = scene.getTransformNodeByName(PointerOverYangan).wendu;
  1279. var font_size = 48;
  1280. var font = "bold " + font_size + "px Arial";
  1281. dynamicTexture.drawText(
  1282. textx + "°C",
  1283. null,
  1284. null,
  1285. font,
  1286. "#FFFFFF",
  1287. "#000000",
  1288. true
  1289. );
  1290. showx++;
  1291. show = 50;
  1292. }
  1293. if (dynamicTexture2 != null && PointerOverYangan != null) {
  1294. var textx = scene.getTransformNodeByName(PointerOverYangan).sidu;
  1295. var font_size = 50;
  1296. var font = "bold " + font_size + "px Arial";
  1297. dynamicTexture2.drawText(
  1298. textx + "%",
  1299. null,
  1300. null,
  1301. font,
  1302. "#FFFFFF",
  1303. "#000000",
  1304. true
  1305. );
  1306. }
  1307. if (dynamicTexture3 != null && PointerOverYangan != null) {
  1308. var textx = scene.getTransformNodeByName(PointerOverYangan).wendu;
  1309. var font_size = 48;
  1310. var font = "bold " + font_size + "px Arial";
  1311. dynamicTexture3.drawText(
  1312. textx + "°C",
  1313. null,
  1314. null,
  1315. font,
  1316. "#FFFFFF",
  1317. "#000000",
  1318. true
  1319. );
  1320. }
  1321. if (dynamicTexture4 != null && PointerOverYangan != null) {
  1322. var textx = scene.getTransformNodeByName(PointerOverYangan).sidu;
  1323. var font_size = 50;
  1324. var font = "bold " + font_size + "px Arial";
  1325. dynamicTexture4.drawText(
  1326. textx + "%",
  1327. null,
  1328. null,
  1329. font,
  1330. "#FFFFFF",
  1331. "#000000",
  1332. true
  1333. );
  1334. }
  1335. /*show--;
  1336. showdd--;*/
  1337. });
  1338. return scene;
  1339. };
  1340. var canvas = document.getElementById("renderCanvas");
  1341. // load the 3D engine
  1342. var engine = new BABYLON.Engine(canvas, true, {
  1343. stencil: true
  1344. });
  1345. // call the createScene function
  1346. var scene = createScene();
  1347. scene.autoClear = true;
  1348. scene.imageProcessingConfiguration.exposure = 1;
  1349. scene.imageProcessingConfiguration.contrast = 1;
  1350. scene.environmentIntensity = 0.4;
  1351. engine.runRenderLoop(function() {
  1352. scene.render();
  1353. });
  1354. window.addEventListener("resize", function() {
  1355. engine.resize();
  1356. });
  1357. function HashMap() {
  1358. //定义长度
  1359. var length = 0;
  1360. //创建一个对象
  1361. var obj = new Object();
  1362. //判断Map是否为空
  1363. this.isEmpty = function() {
  1364. return length == 0;
  1365. };
  1366. //判断对象中是否包含给定Key
  1367. this.containsKey = function(key) {
  1368. return key in obj;
  1369. };
  1370. //判断对象中是否包含给定的Value
  1371. this.containsValue = function(value) {
  1372. for (var key in obj) {
  1373. if (obj[key] == value) {
  1374. return true;
  1375. }
  1376. }
  1377. return false;
  1378. };
  1379. //向map中添加数据
  1380. this.put = function(key, value) {
  1381. if (!this.containsKey(key)) {
  1382. length++;
  1383. }
  1384. obj[key] = value;
  1385. };
  1386. //根据给定的key获取Value
  1387. this.get = function(key) {
  1388. return this.containsKey(key) ? obj[key] : null;
  1389. };
  1390. //根据给定的Key删除一个值
  1391. this.remove = function(key) {
  1392. if (this.containsKey(key) && delete obj[key]) {
  1393. length--;
  1394. }
  1395. };
  1396. //获得Map中所有的value
  1397. this.values = function() {
  1398. var _values = new Array();
  1399. for (var key in obj) {
  1400. _values.push(obj[key]);
  1401. }
  1402. return _values;
  1403. };
  1404. //获得Map中的所有key
  1405. this.keySet = function() {
  1406. var _keys = new Array();
  1407. for (var key in obj) {
  1408. _keys.push(key);
  1409. }
  1410. return _keys;
  1411. };
  1412. //获得Map的长度
  1413. this.size = function() {
  1414. return length;
  1415. };
  1416. //清空Map
  1417. this.clear = function() {
  1418. length = 0;
  1419. obj = new Object();
  1420. };
  1421. }
  1422. var yangans = new HashMap();
  1423. yangans.put("DAK_MO_OAO_001", "yangan01");
  1424. yangans.put("DAK_MO_OAO_002", "yangan02");
  1425. yangans.put("DAK_MO_OAO_003", "yangan03");
  1426. yangans.put("DAK_MO_OAO_004", "yangan04");
  1427. yangans.put("DAK_MO_CAM_001", "camera01");
  1428. yangans.put("DAK_MO_CAM_002", "camera02");
  1429. yangans.put("DAK_MO_CAM_003", "camera03");
  1430. yangans.put("DAK_MO_CAM_004", "camera04");
  1431. //功能转入报警
  1432. function Myalert(MathineID, baojing) {
  1433. scene.getMeshByName("tapblue").setEnabled(false);
  1434. scene.getMeshByName("tapred").setEnabled(false);
  1435. var theName = yangans.get(MathineID);
  1436. if (theName == "yangan01") {
  1437. scene.getTransformNodeByName("yangan01").baojing = baojing;
  1438. }
  1439. if (theName == "yangan02") {
  1440. scene.getTransformNodeByName("yangan02").baojing = baojing;
  1441. }
  1442. if (theName == "yangan03") {
  1443. scene.getTransformNodeByName("yangan03").baojing = baojing;
  1444. }
  1445. if (theName == "yangan04") {
  1446. scene.getTransformNodeByName("yangan04").baojing = baojing;
  1447. }
  1448. if (theName == "camera01") {
  1449. scene.getTransformNodeByName("camera01").baojing = baojing;
  1450. }
  1451. if (theName == "camera02") {
  1452. scene.getTransformNodeByName("camera02").baojing = baojing;
  1453. }
  1454. if (theName == "camera03") {
  1455. scene.getTransformNodeByName("camera03").baojing = baojing;
  1456. }
  1457. if (theName == "camera04") {
  1458. scene.getTransformNodeByName("camera04").baojing = baojing;
  1459. }
  1460. }
  1461. //报警 true:表示报警, false :表示不报警
  1462. //Myalert("DAK_MO_OAO_001",true)
  1463. //设置温湿度
  1464. function setAlertValue(MathineID, wendu, sidu) {
  1465. var theName = yangans.get(MathineID);
  1466. if (theName == "yangan01") {
  1467. scene.getTransformNodeByName("yangan01").wendu = wendu;
  1468. scene.getTransformNodeByName("yangan01").sidu = sidu;
  1469. }
  1470. if (theName == "yangan02") {
  1471. scene.getTransformNodeByName("yangan02").wendu = wendu;
  1472. scene.getTransformNodeByName("yangan02").sidu = sidu;
  1473. }
  1474. if (theName == "yangan03") {
  1475. scene.getTransformNodeByName("yangan03").wendu = wendu;
  1476. scene.getTransformNodeByName("yangan03").sidu = sidu;
  1477. }
  1478. if (theName == "yangan04") {
  1479. scene.getTransformNodeByName("yangan04").wendu = wendu;
  1480. scene.getTransformNodeByName("yangan04").sidu = sidu;
  1481. }
  1482. }
  1483. //设置温湿度: setAlertValue("DAK_MO_OAO_001",4,5)
  1484. // 设置是否显示
  1485. function setYangGanCanshow(MathineID, canshow){
  1486. var theName = yangans.get(MathineID);
  1487. if(theName.indexOf("yangan") >= 0){
  1488. scene.getTransformNodeByName(theName).canshow = canshow;
  1489. }
  1490. }
  1491. // setYangGanCanshow("DAK_MO_OAO_001",false)
  1492. //功能:档案柜标点点击
  1493. // function cabinetClick(cabinet) {
  1494. // alert(cabinet.nameID);
  1495. // }
  1496. function cabinetClick(cabinet) {
  1497. window.parent.postMessage(
  1498. {
  1499. data: cabinet.nameID
  1500. },
  1501. "*"
  1502. );
  1503. }
  1504. // 摄像头和温湿度点击
  1505. // function cameraClick(TheCamera) {
  1506. // alert(TheCamera.nameID);
  1507. // }
  1508. function cameraClick(TheCamera) {
  1509. window.parent.postMessage(
  1510. {
  1511. data: TheCamera.nameID
  1512. },
  1513. "*"
  1514. );
  1515. }
  1516. // 监测父页面传来得初始化得温度湿度值
  1517. window.addEventListener(
  1518. "message",
  1519. function(e) {
  1520. deviceData = e.data.data;
  1521. },
  1522. false
  1523. );