3dModeling UIAnchor.js 徐寅秋 commit at 2021-04-07

3dModeling/tjby28/UIAnchor.js

@@ -39,3 +39,156 @@ function deviceIcon_click(dwtype, floorNum, ownercode) {
 //======================================================================================================================
 // 添加html
 function create_html() {
+    var sign =
+        `<div 
+		</div>`
+    $('#div3d').append($(sign));
+}
+function create_element(dName, deviceTypes, floorNum, ownercode) {
+
+    var srcElem = document.getElementById('board');
+
+    if (deviceTypes == 'YTVA') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J9mvD.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTWP') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J9GPP.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTCI') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J935t.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTEF') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J91UI.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTFC') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J9lVA.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTSM') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J9Mbd.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTLL') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J9J8f.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    } else if (deviceTypes == 'YTWI') {
+        var sign =
+            `<div class="sign" id=${dName} style="font-size: 12px;width: 120px;text-align: center;background-color: rgba(0, 0, 0, .6);border: 0px solid #eeeeee;border-radius: 8px;color: #eee;position: absolute;top: 0;left: 0;z-index: 10;display: none;">
+			<div class="s1" style="margin: 5px 0px 5px 0px;line-height: 32px;overflow: hidden;">
+				<span class="span-l icon" style="float: left;width: 30px;height: 30px;background:url(https://s3.ax1x.com/2021/03/10/6J9Y28.png) no-repeat center;margin: 1px 1px 1px 5px;"></span>
+				<span class="span-l font" style="float: left;margin: 0px 0px 0px 1px;">${dName}</span>
+			</div>
+		</div>`
+    }
+
+    $('#div3d').append($(sign));
+    var newElem = document.getElementById(dName);
+    // var newElem = srcElem.cloneNode(true);
+    newElem.style.display = "block";
+    newElem.setAttribute("onclick", "deviceIcon_click('" + deviceTypes + "','" + floorNum + "','" + ownercode + "')");
+    app.domElement.insertBefore(newElem, srcElem);
+    return newElem;
+}
+// 物体顶界面
+var ui = null;
+var uis = [];
+function create_ui(deviceType, floorNum, deviceList) {
+    var deviceTypes = deviceType;
+    destroy_ui();
+    create_html();
+    deviceIcon = [];
+    for (var j = 0; j < deviceList.length; j++) {
+        if (deviceList[j].dwtype == deviceType) {
+            deviceIcon.push(deviceList[j]);
+        }
+    }
+    if (deviceType == 'YTVA') {
+        deviceType = '摄像头';
+    } else if (deviceType == 'YTWP') {
+        deviceType = '水表';
+    } else if (deviceType == 'YTCI') {
+        deviceType = '环境监测';
+    } else if (deviceType == 'YTEF') {
+        deviceType = '电气火灾';
+    } else if (deviceType == 'YTFC') {
+        deviceType = '消防控制柜';
+    } else if (deviceType == 'YTSM') {
+        deviceType = '烟感';
+    } else if (deviceType == 'YTLL') {
+        deviceType = '液位';
+    }
+    else if (deviceType == 'YTWI') {
+        deviceType = '水浸';
+    }
+    let num;
+    if(floorNum == -1){
+        num = 'B1'
+    }else{
+        num = 'F' + floorNum;
+    }
+    var carList = app.query("#" + num)[0].query(deviceType)
+    var carList1 = app.query("#" + num)[0]
+    console.log(carList)
+    console.log(deviceIcon.length)
+    //   app.query("#" + id)[0].query('.Thing').forEach(function (obj){
+    //     var car = app.query("#"+obj.id)[0];
+    //     panelArr.push(uiAnchor(car));
+    // })
+    for (var i = 0; i < deviceIcon.length; i++) {
+        dName = deviceIcon[i].device_name;
+        var ownercode = deviceIcon[i].owner_code
+        console.log(dName,ownercode,carList[i])
+        ui = app.create({
+            type: 'UIAnchor',
+            parent: carList[i],
+            element: create_element(dName, deviceTypes, floorNum, ownercode),
+            localPosition: [0, 2, 0],
+            pivot: [0.5, 1] //  [0,0]即以界面左上角定位，[1,1]即以界面右下角进行定位
+        });
+        uis.push(ui);
+    }
+
+}
+// 删除界面
+function destroy_ui() {
+    if (uis) {
+        for (var i = 0; i < uis.length; i++) {
+            uis[i].destroy();
+        }
+        uis = [];
+    }
+
+}