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

939 lines
28 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
  1. // 从这里开始
  2. var h1 = null;
  3. var h2 = null;
  4. var oldtransformNodex = null;
  5. var oldtransformNodeOther = null;
  6. var drag = null;
  7. var notmoveGroup = null;
  8. var movedGroup = null;
  9. var movesingle = false;
  10. var dynamicTexture = null;
  11. var dynamicTexture2 = null;
  12. var dynamicTexture3 = null;
  13. var dynamicTexture4 = null;
  14. var PointerOverYangan = null;
  15. var show = 50;
  16. var showdd = 50;
  17. var deviceData = [];
  18. BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function() {
  19. if (document.getElementById("customLoadingScreenDiv")) {
  20. document.getElementById("customLoadingScreenDiv").style.display = "initial";
  21. // 给vue页面传值,加载完成之前
  22. parent.getIframeLoading("true")
  23. return;
  24. }
  25. this._loadingDiv = document.createElement("div");
  26. //this._loadingDiv.style.height = '1750px';
  27. this._loadingDiv.id = "customLoadingScreenDiv";
  28. thecss = "lohingifpc";
  29. thecss2 = "zcpc";
  30. this._loadingDiv.innerHTML =
  31. "<div class='oka'><div class='" +
  32. thecss +
  33. "'><image src='./logok.gif' class='jiazaiimg'/></div><div class='" +
  34. thecss2 +
  35. "'>由 <image class='feitimg' src='./img/yxlogo.png'/> 阅行客 提供技术支持!</div></div>";
  36. this._resizeLoadingUI();
  37. window.addEventListener("resize", this._resizeLoadingUI);
  38. document.body.appendChild(this._loadingDiv);
  39. };
  40. BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function() {
  41. show = 50;
  42. document.getElementById("customLoadingScreenDiv").style.display = "none";
  43. document.getElementById("customLoadingScreenDiv_first").style.display =
  44. "none";
  45. document.title = "阅览室";
  46. //scene.getMaterialByName("材质.023").roughness = 0;
  47. var camera07 = scene.getTransformNodeByName("Camera8");
  48. var camera08 = scene.getTransformNodeByName("Camera9");
  49. camera07.name = "camera07";
  50. camera08.name = "camera08";
  51. camera07.nameID = "YLS_MO_CAM_001";
  52. camera08.nameID = "YLS_MO_CAM_002";
  53. camera07.baojing = false;
  54. camera08.baojing = false;
  55. var yangan06 = scene.getTransformNodeByName("yangan_5");
  56. yangan06.name = "yangan06";
  57. yangan06.nameID = "YLS_MO_OAO_001";
  58. yangan06.wendu = 0;
  59. yangan06.sidu = 0;
  60. yangan06.canshow = true;
  61. var prepareGroupButtonOther = function(transformNodex, color) {
  62. var mesheses = null;
  63. if (transformNodex.getClassName() == "TransformNode") {
  64. mesheses = transformNodex.getChildMeshes(false);
  65. } else {
  66. mesheses = [];
  67. mesheses.push(transformNodex);
  68. }
  69. for (var i = 0; i < mesheses.length; i++) {
  70. mesheses[i].actionManager = new BABYLON.ActionManager(scene);
  71. var theScaling = mesheses[i].scaling;
  72. if (true) {
  73. try {
  74. //mesheses[i].actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOutTrigger, mesheses[i], "scaling", new BABYLON.Vector3(theScaling.x, theScaling.y, theScaling.z), 100));
  75. // 初始化数据 温度/湿度
  76. deviceData.forEach(item => {
  77. if (item.id === transformNodex.nameID) {
  78. transformNodex.wendu = item.wendu;
  79. transformNodex.sidu = item.sidu;
  80. transformNodex.baojing = item.alarmState;
  81. }
  82. });
  83. mesheses[i].actionManager.registerAction(
  84. new BABYLON.ExecuteCodeAction(
  85. {
  86. trigger: BABYLON.ActionManager.OnPointerOverTrigger,
  87. parameter: ""
  88. },
  89. function() {
  90. clickbegin = true;
  91. if (true) {
  92. try {
  93. if (oldtransformNodeOther != null) {
  94. oldtransformNodeOther.removeBehavior(drag);
  95. var mesheses2 = null;
  96. if (
  97. oldtransformNodeOther.getClassName() == "TransformNode"
  98. ) {
  99. mesheses2 = oldtransformNodeOther.getChildMeshes(false);
  100. } else {
  101. mesheses2 = [];
  102. mesheses2.push(oldtransformNodeOther);
  103. }
  104. for (var i = 0; i < mesheses2.length; i++) {
  105. try {
  106. h2.removeMesh(mesheses2[i]);
  107. } catch (error) {
  108. // alert(error)
  109. }
  110. }
  111. }
  112. oldtransformNodeOther = transformNodex;
  113. //transformNodex.addBehavior(drag);
  114. var mesheses3 = null;
  115. if (transformNodex.getClassName() == "TransformNode") {
  116. mesheses3 = transformNodex.getChildMeshes(false);
  117. } else {
  118. mesheses3 = [];
  119. mesheses3.push(transformNodex);
  120. }
  121. for (var i = 0; i < mesheses3.length; i++) {
  122. try {
  123. if (transformNodex.baojing == true) {
  124. h2.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  125. } else {
  126. h2.addMesh(mesheses3[i], color);
  127. }
  128. } catch (error) {
  129. // alert(error)
  130. }
  131. }
  132. } catch (error) {
  133. // alert(error)
  134. }
  135. clickbegin = false;
  136. }
  137. if (transformNodex.name.indexOf("yangan") >= 0) {
  138. console.log(transformNodex.name);
  139. PointerOverYangan = transformNodex.name;
  140. if (transformNodex.baojing == true) {
  141. var location = transformNodex.absolutePosition;
  142. var xd = scene.getMeshByName("tapred");
  143. // x = x-0.6;; y = y+0.3 z=z+0.5
  144. xd.position = new BABYLON.Vector3(
  145. location.x - 0.6,
  146. location.y + 0.9,
  147. location.z + 0.5
  148. );
  149. var font_size = 36;
  150. var font = "bold " + font_size + "px Arial";
  151. dynamicTexture3.drawText(
  152. transformNodex.wendu + "°C",
  153. null,
  154. null,
  155. font,
  156. "#FFFFFF",
  157. "#000000",
  158. true
  159. );
  160. dynamicTexture4.drawText(
  161. transformNodex.sidu + "%",
  162. null,
  163. null,
  164. font,
  165. "#FFFFFF",
  166. "#000000",
  167. true
  168. );
  169. if(transformNodex.canshow == true){
  170. xd.setEnabled(true);
  171. }
  172. } else {
  173. var location = transformNodex.absolutePosition;
  174. var xd = scene.getMeshByName("tapblue");
  175. // x = x-0.6;; y = y+0.3 z=z+0.5
  176. xd.position = new BABYLON.Vector3(
  177. location.x - 0.6,
  178. location.y + 0.9,
  179. location.z + 0.5
  180. );
  181. var font_size = 36;
  182. var font = "bold " + font_size + "px Arial";
  183. dynamicTexture.drawText(
  184. transformNodex.wendu + "°C",
  185. null,
  186. null,
  187. font,
  188. "#FFFFFF",
  189. "#000000",
  190. true
  191. );
  192. dynamicTexture2.drawText(
  193. transformNodex.sidu + "%",
  194. null,
  195. null,
  196. font,
  197. "#FFFFFF",
  198. "#000000",
  199. true
  200. );
  201. if(transformNodex.canshow == true){
  202. xd.setEnabled(true);
  203. }
  204. }
  205. }
  206. }
  207. )
  208. );
  209. mesheses[i].actionManager.registerAction(
  210. new BABYLON.ExecuteCodeAction(
  211. {
  212. trigger: BABYLON.ActionManager.OnPointerOutTrigger,
  213. parameter: ""
  214. },
  215. function() {
  216. var mesheses2 = null;
  217. if (transformNodex.getClassName() == "TransformNode") {
  218. mesheses2 = transformNodex.getChildMeshes(false);
  219. } else {
  220. mesheses2 = [];
  221. mesheses2.push(transformNodex);
  222. }
  223. for (var i = 0; i < mesheses2.length; i++) {
  224. try {
  225. h2.removeMesh(mesheses2[i]);
  226. } catch (error) {
  227. // alert(error)
  228. }
  229. }
  230. if (transformNodex.name.indexOf("yangan") >= 0) {
  231. if (transformNodex.baojing == true) {
  232. var location = transformNodex.absolutePosition;
  233. var xd = scene.getMeshByName("tapred");
  234. // x = x-0.6;; y = y+0.3 z=z+0.5
  235. xd.setEnabled(false);
  236. } else {
  237. var location = transformNodex.absolutePosition;
  238. var xd = scene.getMeshByName("tapblue");
  239. // x = x-0.6;; y = y+0.3 z=z+0.5
  240. xd.setEnabled(false);
  241. }
  242. }
  243. }
  244. )
  245. );
  246. //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));
  247. } catch (error) {
  248. //alert(error)
  249. }
  250. }
  251. var clickbegin = false;
  252. mesheses[i].actionManager.registerAction(
  253. new BABYLON.ExecuteCodeAction(
  254. {
  255. trigger: BABYLON.ActionManager.OnPickTrigger,
  256. parameter: ""
  257. },
  258. function() {
  259. cameraClick(transformNodex);
  260. }
  261. )
  262. );
  263. }
  264. };
  265. prepareGroupButtonOther(camera07, new BABYLON.Color3(0, 0, 1));
  266. prepareGroupButtonOther(camera08, new BABYLON.Color3(0, 0, 1));
  267. prepareGroupButtonOther(yangan06, new BABYLON.Color3(0, 0, 1));
  268. //修改贴图
  269. var bluexMat = new BABYLON.PBRMaterial("bluex", scene);
  270. var tempddxa = new BABYLON.Texture("./asset/blue.png", scene);
  271. var tempddxb = new BABYLON.Texture("./asset/blue.png", scene);
  272. tempddxa.hasAlpha = true;
  273. tempddxa.hasAlpha = true;
  274. tempddxa.uAng = (180 * Math.PI) / 180;
  275. tempddxb.uAng = (180 * Math.PI) / 180;
  276. bluexMat.useAlphaFromAlbedoTexture = true;
  277. bluexMat.albedoTexture = tempddxa;
  278. bluexMat.reflectionColor = new BABYLON.Color3(0, 0, 0);
  279. bluexMat.lightmapTexture = tempddxb;
  280. scene.getMeshByName("平面_1").material = bluexMat;
  281. var redMat = new BABYLON.PBRMaterial("redMat", scene);
  282. var tempddx2 = new BABYLON.Texture("./asset/red.png", scene);
  283. var tempddx3 = new BABYLON.Texture("./asset/red.png", scene);
  284. tempddx2.hasAlpha = true;
  285. tempddx3.hasAlpha = true;
  286. tempddx2.uAng = (180 * Math.PI) / 180;
  287. tempddx3.uAng = (180 * Math.PI) / 180;
  288. redMat.useAlphaFromAlbedoTexture = true;
  289. redMat.reflectionColor = new BABYLON.Color3(0, 0, 0);
  290. //redMat.emissiveTexture =tempddx2;
  291. redMat.albedoTexture = tempddx2;
  292. redMat.lightmapTexture = tempddx3;
  293. scene.getMeshByName("平面_1_2").material = redMat;
  294. var font_size = 48;
  295. var font = "bold " + font_size + "px Arial";
  296. //Set height for plane
  297. var planeHeight = 3;
  298. //Set height for dynamic texture
  299. var DTHeight = 1.5 * font_size; //or set as wished
  300. //Calcultae ratio
  301. var ratio = planeHeight / DTHeight;
  302. //Set text
  303. var text = "10";
  304. //Use a temporay dynamic texture to calculate the length of the text on the dynamic texture canvas
  305. var temp = new BABYLON.DynamicTexture("DynamicTexture", 64, scene);
  306. var tmpctx = temp.getContext();
  307. tmpctx.font = font;
  308. var DTWidth = tmpctx.measureText(text).width + 58;
  309. //Calculate width the plane has to be
  310. var planeWidth = DTWidth * ratio;
  311. //Create dynamic texture and write the text
  312. dynamicTexture = new BABYLON.DynamicTexture(
  313. "DynamicTexture",
  314. { width: DTWidth, height: DTHeight },
  315. scene,
  316. false
  317. );
  318. var mat = new BABYLON.StandardMaterial("mat", scene);
  319. //var mat = new BABYLON.PBRMaterial("mat", scene);
  320. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  321. mat.disableLighting = true;
  322. mat.emissiveTexture = dynamicTexture;
  323. mat.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  324. dynamicTexture.uAng = (166.39 * Math.PI) / 180;
  325. //Create plane and set dynamic texture as material
  326. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  327. var vxd = scene.getMeshByName("平面_2"); //blue
  328. vxd.material = mat;
  329. //平面3
  330. dynamicTexture2 = new BABYLON.DynamicTexture(
  331. "DynamicTexture2",
  332. { width: DTWidth, height: DTHeight },
  333. scene,
  334. false
  335. );
  336. //var mat = new BABYLON.StandardMaterial("mat", scene);
  337. //mat.disableLighting = true;
  338. var mat2 = new BABYLON.StandardMaterial("mat2", scene);
  339. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  340. mat2.disableLighting = true;
  341. //mat2.ambientTexture = dynamicTexture2;
  342. mat2.emissiveTexture = dynamicTexture2;
  343. mat2.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  344. dynamicTexture2.uAng = (166.39 * Math.PI) / 180;
  345. //Create plane and set dynamic texture as material
  346. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  347. var vxd2 = scene.getMeshByName("平面_3");
  348. vxd2.material = mat2;
  349. //-------------------------------------------------------------------------------------
  350. dynamicTexture3 = new BABYLON.DynamicTexture(
  351. "DynamicTexture3",
  352. { width: DTWidth, height: DTHeight },
  353. scene,
  354. false
  355. );
  356. //var mat = new BABYLON.StandardMaterial("mat", scene);
  357. //mat.disableLighting = true;
  358. var mat3 = new BABYLON.StandardMaterial("mat3", scene);
  359. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  360. mat3.disableLighting = true;
  361. //mat2.ambientTexture = dynamicTexture2;
  362. mat3.emissiveTexture = dynamicTexture3;
  363. mat3.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  364. dynamicTexture3.uAng = (166.39 * Math.PI) / 180;
  365. //Create plane and set dynamic texture as material
  366. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  367. var vxd3 = scene.getMeshByName("平面_2_2"); //blue
  368. vxd3.material = mat3;
  369. //-------------------------------------------------------------------------------------
  370. dynamicTexture4 = new BABYLON.DynamicTexture(
  371. "dynamicTexture4",
  372. { width: DTWidth, height: DTHeight },
  373. scene,
  374. false
  375. );
  376. //var mat = new BABYLON.StandardMaterial("mat", scene);
  377. //mat.disableLighting = true;
  378. var mat4 = new BABYLON.StandardMaterial("mat4", scene);
  379. //mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
  380. mat4.disableLighting = true;
  381. //mat2.ambientTexture = dynamicTexture2;
  382. mat4.emissiveTexture = dynamicTexture4;
  383. mat4.reflectivityColor = new BABYLON.Color3(0, 0, 0);
  384. dynamicTexture4.uAng = (166.39 * Math.PI) / 180;
  385. //Create plane and set dynamic texture as material
  386. //var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
  387. var vxd4 = scene.getMeshByName("平面_3_2");
  388. vxd4.material = mat4;
  389. scene.getMeshByName("tapblue").setEnabled(false);
  390. scene.getMeshByName("tapred").setEnabled(false);
  391. var light = new BABYLON.HemisphericLight(
  392. "HemiLight",
  393. new BABYLON.Vector3(0, 1, 0),
  394. scene
  395. );
  396. light.intensity = 2;
  397. light.diffuse = new BABYLON.Color3(0.92, 0.92, 0.92);
  398. scene.getMaterialByName("cover_label.001").metallic = 0.36;
  399. scene.getMaterialByName("cover_label.001").albedoColor = new BABYLON.Color3(
  400. 1,
  401. 1,
  402. 1
  403. );
  404. scene.getMaterialByName("Desk.001").metallic = 0.8;
  405. scene.getMaterialByName("Desk.001").roughness = 0.72;
  406. scene.getMaterialByName("Desk.005").metallic = 0.8;
  407. scene.getMaterialByName("Desk.005").roughness = 0.72;
  408. scene.getMaterialByName("Desk.006").metallic = 0.8;
  409. scene.getMaterialByName("Desk.006").roughness = 0.72;
  410. var plane = BABYLON.MeshBuilder.CreatePlane(
  411. "plane",
  412. { width: 10, height: 10 },
  413. scene
  414. );
  415. plane.position = new BABYLON.Vector3(0.11, 1.93, -0.28);
  416. plane.rotation = new BABYLON.Vector3((90 * Math.PI) / 180, 0, 0);
  417. plane.scaling = new BABYLON.Vector3(1.2, 0.8, 1);
  418. // 给vue页面传值,加载完成之后
  419. parent.getIframeLoading("false")
  420. };
  421. // createScene function that creates and return the scene
  422. var createScene = function() {
  423. engine.displayLoadingUI();
  424. // create a basic BJS Scene object
  425. var scene = new BABYLON.Scene(engine);
  426. // scene.debugLayer.show();
  427. var camera = new BABYLON.ArcRotateCamera(
  428. "Camera",
  429. 0,
  430. 0,
  431. 5,
  432. new BABYLON.Vector3(0, -1, 0),
  433. scene
  434. );
  435. camera.setTarget(new BABYLON.Vector3(0, 3.5, 0));
  436. camera.attachControl(canvas, true);
  437. camera.lowerRadiusLimit = 2.0; // 这里是最大的位置,值越大,物体越小
  438. camera.upperRadiusLimit = 40;
  439. camera.radius = 14.888;
  440. camera.alpha = (Math.PI * -223.57) / 180;
  441. camera.beta = (Math.PI * 66) / 180;
  442. camera.inertia = 0.1; // 缩放的快慢
  443. camera.useAutoRotationBehavior = true; // 自动旋转
  444. camera.panningDistanceLimit = 2; //平移半径
  445. camera.panningInertia = 0;
  446. camera.autoTransitionRange = 1;
  447. camera.pinchToPanMaxDistance = 0.1;
  448. camera.pinchDeltaPercentage = 0.001;
  449. camera.useAutoRotationBehavior = false;
  450. scene.activeCamera = camera;
  451. // 改变场景背景颜色 - 背景颜色opacity值设为0,达到透明背景的效果
  452. scene.clearColor = new BABYLON.Color4(0, 0, 0, 0);
  453. scene.activeCamera.useInputToRestoreState = true;
  454. var camera1_status = scene.activeCamera.storeState();
  455. var assetsManager = new BABYLON.AssetsManager(scene);
  456. var meshTask = assetsManager.addMeshTask(
  457. "skull task",
  458. "",
  459. "asset/",
  460. "c3.glb"
  461. );
  462. meshTask.onSuccess = function(task) {
  463. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.4, 0.4, -0.4);
  464. task.loadedMeshes[0].position = new BABYLON.Vector3(0.0, 2, 0);
  465. };
  466. meshTask.onError = function(task, message, exception) {
  467. console.log(message, exception);
  468. };
  469. var meshTask_tapblue = assetsManager.addMeshTask(
  470. "skull task",
  471. "",
  472. "asset/",
  473. "tapBlue.glb"
  474. );
  475. meshTask_tapblue.onSuccess = function(task) {
  476. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.4, 0.4, -0.4);
  477. task.loadedMeshes[0].position = new BABYLON.Vector3(0, 0, 0);
  478. //-2.5,3.77,1.45
  479. // x = x-0.6;; y = y+0.3 z=z+0.5
  480. task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
  481. task.loadedMeshes[0].name = "tapblue";
  482. var vx = scene.getTransformNodeByName("蓝");
  483. vx.position = new BABYLON.Vector3(0, -1.2, 0);
  484. vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
  485. vx.scaling = new BABYLON.Vector3(0.015, 0.015, 0.015);
  486. };
  487. meshTask_tapblue.onError = function(task, message, exception) {
  488. console.log(message, exception);
  489. };
  490. var meshTask_tapred = assetsManager.addMeshTask(
  491. "skull task",
  492. "",
  493. "asset/",
  494. "tapRed.glb"
  495. );
  496. meshTask_tapred.onSuccess = function(task) {
  497. task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.4, 0.4, -0.4);
  498. task.loadedMeshes[0].position = new BABYLON.Vector3(-1.929, 4.029, 0.968);
  499. //-2.5,3.77,1.45
  500. // x = x-0.6;; y = y+0.3 z=z+0.5
  501. task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
  502. task.loadedMeshes[0].name = "tapred";
  503. var vx = scene.getTransformNodeByName("红");
  504. vx.position = new BABYLON.Vector3(0, -1.2, 0);
  505. vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
  506. vx.scaling = new BABYLON.Vector3(0.015, 0.015, 0.015);
  507. };
  508. meshTask_tapred.onError = function(task, message, exception) {
  509. console.log(message, exception);
  510. };
  511. var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData(
  512. "textures/environmentSpecular.env",
  513. scene
  514. );
  515. //var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData("textures/environment.env", scene);
  516. scene.environmentTexture = hdrTexture;
  517. // renderCanvas.style.backgroundImage = 'url("./textures/' + '4' + '.jpg")';
  518. assetsManager.load();
  519. drag = new BABYLON.PointerDragBehavior({
  520. dragPlaneNormal: new BABYLON.Vector3(0, 0, 1)
  521. });
  522. //drag.useObjectOrienationForDragging = false;
  523. drag.validateDrag = targetPosition => {
  524. console.log(targetPosition);
  525. if (targetPosition.x > 10.5 || targetPosition.x < -10.5) {
  526. return false;
  527. }
  528. if (targetPosition.z > 10.5 || targetPosition.z < -10.5) {
  529. return false;
  530. }
  531. if (oldtransformNodex != null) {
  532. return true;
  533. }
  534. };
  535. drag.onDragEndObservable.add(event => {
  536. console.log("dragEnd");
  537. //console.log(event);
  538. //console.log(line03_position)
  539. });
  540. //GUI
  541. h1 = new BABYLON.HighlightLayer("hl1", scene);
  542. h2 = new BABYLON.HighlightLayer("hl2", scene);
  543. h3 = new BABYLON.HighlightLayer("hl3", scene);
  544. var step = 0.1;
  545. var currentx = 1;
  546. var step2 = 0.1;
  547. var currentx2 = 0.1;
  548. h1.blurHorizontalSize = 0.1;
  549. var showx = 0;
  550. var showx2 = 2;
  551. scene.registerAfterRender(() => {
  552. h1.blurHorizontalSize = h1.blurVerticalSize + currentx;
  553. h2.blurHorizontalSize = h2.blurVerticalSize + currentx2;
  554. h3.blurHorizontalSize = h3.blurVerticalSize + currentx2;
  555. var a = scene.getMaterialByName("carpaint_baseRed");
  556. if (a != null) {
  557. if (a.albedoColor == b) {
  558. b = new BABYLON.Color3(0, 1, 0);
  559. a.albedoColor = b;
  560. }
  561. }
  562. var nodealert = scene.getTransformNodeByName("yangan06");
  563. if (nodealert != null) {
  564. var mesheses3 = null;
  565. if (nodealert.getClassName() == "TransformNode") {
  566. mesheses3 = nodealert.getChildMeshes(false);
  567. } else {
  568. mesheses3 = [];
  569. mesheses3.push(nodealert);
  570. }
  571. for (var i = 0; i < mesheses3.length; i++) {
  572. try {
  573. if (nodealert.baojing == true) {
  574. h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
  575. } else {
  576. h3.removeMesh(mesheses3[i]);
  577. }
  578. } catch (error) {
  579. // alert(error)
  580. }
  581. }
  582. }
  583. var v2 = scene.getMeshByName("tapblue");
  584. if (v2 != null) {
  585. v2.lookAt(camera.globalPosition, 0, 0, Math.PI);
  586. }
  587. var v3 = scene.getMeshByName("tapred");
  588. if (v3 != null) {
  589. v3.lookAt(camera.globalPosition, 0, 0, Math.PI);
  590. }
  591. if (currentx > 0.5) {
  592. step *= -1;
  593. }
  594. if (currentx < 0) {
  595. step *= -1;
  596. }
  597. currentx += step;
  598. if (currentx2 > 5) {
  599. step2 *= -1;
  600. }
  601. if (currentx2 < 0) {
  602. step2 *= -1;
  603. }
  604. currentx2 += step2;
  605. if (dynamicTexture != null && PointerOverYangan != null) {
  606. var textx = scene.getTransformNodeByName(PointerOverYangan).wendu;
  607. var font_size = 36;
  608. var font = "bold " + font_size + "px Arial";
  609. dynamicTexture.drawText(
  610. textx + "°C",
  611. null,
  612. null,
  613. font,
  614. "#FFFFFF",
  615. "#000000",
  616. true
  617. );
  618. showx++;
  619. show = 50;
  620. }
  621. if (dynamicTexture2 != null && PointerOverYangan != null) {
  622. var textx = scene.getTransformNodeByName(PointerOverYangan).sidu;
  623. var font_size = 36;
  624. var font = "bold " + font_size + "px Arial";
  625. dynamicTexture2.drawText(
  626. textx + "%",
  627. null,
  628. null,
  629. font,
  630. "#FFFFFF",
  631. "#000000",
  632. true
  633. );
  634. }
  635. if (dynamicTexture3 != null && PointerOverYangan != null) {
  636. var textx = scene.getTransformNodeByName(PointerOverYangan).wendu;
  637. var font_size = 36;
  638. var font = "bold " + font_size + "px Arial";
  639. dynamicTexture3.drawText(
  640. textx + "°C",
  641. null,
  642. null,
  643. font,
  644. "#FFFFFF",
  645. "#000000",
  646. true
  647. );
  648. }
  649. if (dynamicTexture4 != null && PointerOverYangan != null) {
  650. var textx = scene.getTransformNodeByName(PointerOverYangan).sidu;
  651. var font_size = 36;
  652. var font = "bold " + font_size + "px Arial";
  653. dynamicTexture4.drawText(
  654. textx + "%",
  655. null,
  656. null,
  657. font,
  658. "#FFFFFF",
  659. "#000000",
  660. true
  661. );
  662. }
  663. });
  664. return scene;
  665. };
  666. var canvas = document.getElementById("renderCanvas");
  667. // load the 3D engine
  668. var engine = new BABYLON.Engine(canvas, true, {
  669. stencil: true
  670. });
  671. // call the createScene function
  672. var scene = createScene();
  673. scene.autoClear = true;
  674. scene.imageProcessingConfiguration.exposure = 1;
  675. scene.imageProcessingConfiguration.contrast = 1;
  676. scene.environmentIntensity = 0.4;
  677. engine.runRenderLoop(function() {
  678. scene.render();
  679. });
  680. window.addEventListener("resize", function() {
  681. engine.resize();
  682. });
  683. function HashMap() {
  684. //定义长度
  685. var length = 0;
  686. //创建一个对象
  687. var obj = new Object();
  688. //判断Map是否为空
  689. this.isEmpty = function() {
  690. return length == 0;
  691. };
  692. //判断对象中是否包含给定Key
  693. this.containsKey = function(key) {
  694. return key in obj;
  695. };
  696. //判断对象中是否包含给定的Value
  697. this.containsValue = function(value) {
  698. for (var key in obj) {
  699. if (obj[key] == value) {
  700. return true;
  701. }
  702. }
  703. return false;
  704. };
  705. //向map中添加数据
  706. this.put = function(key, value) {
  707. if (!this.containsKey(key)) {
  708. length++;
  709. }
  710. obj[key] = value;
  711. };
  712. //根据给定的key获取Value
  713. this.get = function(key) {
  714. return this.containsKey(key) ? obj[key] : null;
  715. };
  716. //根据给定的Key删除一个值
  717. this.remove = function(key) {
  718. if (this.containsKey(key) && delete obj[key]) {
  719. length--;
  720. }
  721. };
  722. //获得Map中所有的value
  723. this.values = function() {
  724. var _values = new Array();
  725. for (var key in obj) {
  726. _values.push(obj[key]);
  727. }
  728. return _values;
  729. };
  730. //获得Map中的所有key
  731. this.keySet = function() {
  732. var _keys = new Array();
  733. for (var key in obj) {
  734. _keys.push(key);
  735. }
  736. return _keys;
  737. };
  738. //获得Map的长度
  739. this.size = function() {
  740. return length;
  741. };
  742. //清空Map
  743. this.clear = function() {
  744. length = 0;
  745. obj = new Object();
  746. };
  747. }
  748. var yangans = new HashMap();
  749. yangans.put("YLS_MO_OAO_001", "yangan06");
  750. yangans.put("YLS_MO_CAM_001", "camera07");
  751. yangans.put("YLS_MO_CAM_002", "camera08");
  752. //功能转入报警
  753. function Myalert(MathineID, baojing) {
  754. scene.getMeshByName("tapblue").setEnabled(false);
  755. scene.getMeshByName("tapred").setEnabled(false);
  756. var theName = yangans.get(MathineID);
  757. alert(theName);
  758. if (theName == "yangan06") {
  759. scene.getTransformNodeByName("yangan06").baojing = baojing;
  760. }
  761. if (theName == "camera07") {
  762. scene.getTransformNodeByName("camera07").baojing = baojing;
  763. }
  764. if (theName == "camera08") {
  765. scene.getTransformNodeByName("camera08").baojing = baojing;
  766. }
  767. }
  768. //报警 true:表示报警, false :表示不报警
  769. // Myalert("YLS_MO_OAO_001",true)
  770. //设置温湿度
  771. function setAlertValue(MathineID, wendu, sidu) {
  772. var theName = yangans.get(MathineID);
  773. if (theName == "yangan06") {
  774. scene.getTransformNodeByName("yangan06").wendu = wendu;
  775. scene.getTransformNodeByName("yangan06").sidu = sidu;
  776. }
  777. }
  778. //设置温湿度: setAlertValue("DAK_MO_OAO_001",4,5)
  779. // setAlertValue("YLS_MO_OAO_001", 4, 5);
  780. // 设置是否显示
  781. function setYangGanCanshow(MathineID, canshow){
  782. var theName = yangans.get(MathineID);
  783. if(theName == "yangan06"){
  784. scene.getTransformNodeByName(theName).canshow = canshow;
  785. }
  786. }
  787. // setYangGanCanshow("DAK_MO_OAO_001",false)
  788. // function cameraClick(TheCamera) {
  789. // alert(TheCamera.nameID);
  790. // }
  791. function cameraClick(TheCamera) {
  792. window.parent.postMessage(
  793. {
  794. data: TheCamera.nameID
  795. },
  796. "*"
  797. );
  798. }
  799. // 监测父页面传来得初始化得温度湿度值
  800. window.addEventListener(
  801. "message",
  802. function(e) {
  803. deviceData = e.data.data;
  804. },
  805. false
  806. );