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

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