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

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