From 65430da79c8f21e0a1bac4fba541fd5cb53c0243 Mon Sep 17 00:00:00 2001 From: lxc <237024898@qq.com> Date: Wed, 21 Dec 2022 11:46:24 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .DS_Store | Bin 10244 -> 10244 bytes assets/.DS_Store | Bin 6148 -> 6148 bytes js/app.js | 20 +- libs/.DS_Store | Bin 6148 -> 6148 bytes libs/three/.DS_Store | Bin 6148 -> 6148 bytes libs/three/jsm/.DS_Store | Bin 0 -> 6148 bytes lndexUASB.html | 11 +- lndexUASB2.html | 48 +-- lndexUASBUpdate.html | 616 +++++++++++++++++++++++++++++++++++++++ temp.html | 145 +++++++++ 10 files changed, 809 insertions(+), 31 deletions(-) create mode 100644 libs/three/jsm/.DS_Store create mode 100644 lndexUASBUpdate.html create mode 100644 temp.html diff --git a/.DS_Store b/.DS_Store index e7145b9b151de678e558f9071647d9addf430ac1..a4b4f9d8b6a8986c3d7ac8c64fc88c248db248f8 100644 GIT binary patch delta 497 zcmZn(XbG6$XEU^hRb=4Kv&Tt+z-hBStJhCGInl;Y%^r2PCG1|Wb7P8JXs4TUPm z&3AE0%E?ax%5zLDTd+5D}DQ;T*l38Lep3_zZYj@+{`M;#J;iNE8}K%gKH?wp6 diff --git a/js/app.js b/js/app.js index ce52cb3..004f05b 100644 --- a/js/app.js +++ b/js/app.js @@ -14,6 +14,8 @@ var APP = { var waters = []; //CSS 标签列表 var BIG_LABEL_ARR = []; + //刷新函数列表 + var FUN_ARR = []; camera = new THREE.PerspectiveCamera( 45, @@ -223,10 +225,15 @@ var APP = { glRenderer.render(glScene, camera); cssRenderer.render(cssScene, camera); - // waters.forEach(water => { - // // 播放特效 - // water.material.uniforms['time'].value += 1.0 / 60.0; - // }); + waters.forEach(water => { + // 播放特效 + water.material.uniforms['time'].value += 1.0 / 60.0; + }); + FUN_ARR.forEach( fun=> { + // 播放特效 + fun(); + }); + } @@ -416,6 +423,11 @@ var APP = { tmplable.element.textContent = text; }) } + + this.addRefeshFunction = function(fun){ + FUN_ARR.push(fun); + + } } diff --git a/libs/.DS_Store b/libs/.DS_Store index cd6945716218c7b8155b466e3e8d226f662a47d9..b72643d4faba29926fbdb0668a2013ec9a4744e3 100644 GIT binary patch delta 38 ucmZoMXfc@J&nU1lU^g?Pz-Atnc4p3$;^ds9{QMlo$*t_!o7p-3@&f?pY78m> delta 31 ncmZoMXfc@J&&aB!ku~2NHo+2aH#(>?7i&&T#xi<4K*)ys!Gh{IoGvuZeC+8&P=jSjo zFfc%c%7TmXa`N-ifg+5XJ(#C4ZD!}-=Kz|t`6Kgp=E?jbjvPSMOh9Rd%@HDNm;rJF B81Mi9 delta 76 zcmZoMXfc=|#>B)qu~2NHo+2a1#(>?7tQ-ss3`~<7S%o(%vuH4GE@7R_w6Q^xX)`+q eKL=3lWYig)oe#zz4PbkLx&WY4bGvr(pq zV-eBWWjhsVMWlfn%FROG?A*L(gUl!pjyo=Ll%1Tmr_H`s{XSvbM$TYe5uf<$!(nfS zG%7#^r~nn90#x9u3S@h2#$Uaamr(&K@DB>u_o2WIYhoAZpAG~c0e~Z<-LUpq0$3~o ztchJ9GB6D)FsPa%h6Ww^l65t)3k Xab6R -1) { // 水泵 - x = x + 1; + x = x + 1; PUMP_MODEL_ARR.push(item); //debugger if (item.name === '水泵001') { @@ -230,7 +231,7 @@ }) - console.log('pumpModelArr=', pumpModelArr) + console.log('pumpModelArr=', PUMP_MODEL_ARR) } // 设置标签 @@ -535,7 +536,7 @@ if (!err) { console.log(`订阅/scene/update/* 成功`); } - }); + }); mqttclient.subscribe("RTData", (err) => { if (!err) { console.log(`订阅 RTData 成功`); diff --git a/lndexUASB2.html b/lndexUASB2.html index 0688603..51708f5 100644 --- a/lndexUASB2.html +++ b/lndexUASB2.html @@ -32,15 +32,9 @@ .label { color: #ff000f; font-family: sans-serif; - padding: 20px; + padding: 40px; background: rgba(149, 140, 140, 0.6); } - .red-box-label { - color: #ff000f; - font-family: sans-serif; - padding: 20px; - background: rgba(255, 0, 0, 0.6); - } .btn { color: #ff000f; @@ -96,14 +90,15 @@ window.THREE = THREE; // Used by APP Scripts. - var client = null; + var mqttclient = null; var player = new APP.Player(); //水泵列表 - var pumpModelArr = [] + var PUMP_MODEL_ARR = [] var bigLabelArr = [] + //红色标签 // const labArr = [{ name: "水泵M_1", text: "水泵1" }, { name: "水泵M_2", text: "水泵002" } // , { name: "水泵M_3", text: "水泵003" }, { name: "水泵M_4", text: "水泵4" }, { name: "水泵M_5", text: "水泵5" } @@ -142,6 +137,7 @@ addRemarkLabels(); mqttInit(); + updateLabel(); // for (var i = 0; i < 1; i++) { // player.create3dPage( // 1020, 680, @@ -216,7 +212,7 @@ } else if (item.name.indexOf('水泵M_') > -1) { // 水泵 x = x + 1; - pumpModelArr.push(item); + PUMP_MODEL_ARR.push(item); //debugger if (item.name === '水泵001') { item.material.color.set(0x00f); @@ -235,7 +231,7 @@ }) - console.log('pumpModelArr=', pumpModelArr) + console.log('pumpModelArr=', PUMP_MODEL_ARR) } // 设置标签 @@ -520,14 +516,14 @@ username: config.mqttUserName, password: config.mqttPassword, } - client = mqtt.connect('ws://127.0.0.1:8083/mqtt', options); - client.on('reconnect', function (error) { + mqttclient = mqtt.connect('ws://127.0.0.1:8083/mqtt', options); + mqttclient.on('reconnect', function (error) { console.log("reconnect"); }) - client.on('error', function (error) { + mqttclient.on('error', function (error) { console.log('连接失败:', error) }) - client.on('message', function (topic, message, s) { + mqttclient.on('message', function (topic, message, s) { console.log(topic, message.toString()); if (message.toString() == '1') { // if (that.lastTime + 2 * 1000 < new Date().getTime()) { @@ -536,14 +532,17 @@ // } } }) - client.subscribe("/scene/update/*"); - client.subscribe("scene"); - client.publish('/sys/update/scene', 'scene'); - client.subscribe("RTData", (err) => { + mqttclient.subscribe("/scene/update/*", (err) => { + if (!err) { + console.log(`订阅/scene/update/* 成功`); + } + }); + mqttclient.subscribe("RTData", (err) => { if (!err) { console.log(`订阅 RTData 成功`); } }); + mqttclient.publish('/sys/update/scene', 'scene'); } //打开对话框 function openDialog(tmpobj) { @@ -561,10 +560,15 @@ }); } - function updateLabel(event) { - - alert(event) + function updateLabel() { + // return + // debugger + setTimeout(updateLabel, 1000); //5秒后执行 + let date = new Date(); + let m = date.getSeconds(); + player.updateLabel("", m); } + diff --git a/lndexUASBUpdate.html b/lndexUASBUpdate.html new file mode 100644 index 0000000..4d94388 --- /dev/null +++ b/lndexUASBUpdate.html @@ -0,0 +1,616 @@ + + + + + + + + + + + + + + + +
2D数据表格显示 不旋转 厌氧系统
+ + + + + + + + + diff --git a/temp.html b/temp.html new file mode 100644 index 0000000..e927757 --- /dev/null +++ b/temp.html @@ -0,0 +1,145 @@ + + + + + Threejs引入字体，实现3D文字，Canvas画布作为纹理贴图实现滚动字幕 + + + + + + + + + + + + +
+ + + +