优化

src/layoutMain/components/Navbar.vue

@@ -168,7 +168,7 @@ function setLayout() {
   // background: #202a60;
   display: flex;
   justify-content: space-between;
-  background: url('@/assets/images/top_banner_deep.png') no-repeat #202a60;
+  background: url('@/assets/images/top_banner_deep.png') no-repeat #000000;
 
   .left {
     width: 33%;

src/views/bim/bimHome/components/ThreeView2.vue

@@ -36,9 +36,13 @@ onMounted(() => {
     document.addEventListener("click", onMouseDown);
     // document.addEventListener("mousemove", onMouseMove);
 });
-let scene, renderer, camera, controls, isAddLabel = true;
+let scene, renderer, camera, controls = true;
 let mouse = new THREE.Vector2();
 let labelRenderer = new CSS2DRenderer(); //新建CSS2DRenderer
+const data = reactive({
+    isAddLabel: true
+});
+const { isAddLabel } = toRefs(data);
 // 建筑树点击
 Bus.on('clickBuild', (isParent) => {
     // Todo
@@ -48,7 +52,7 @@ Bus.on('clickBuild', (isParent) => {
         var Floor = scene.getObjectByName(clickName);
         // 拉近场景
         // nearCamera(Floor);
-        centerSelectedGroup(Floor);
+        boxLight(Floor);
         return;
     }
 })
@@ -57,8 +61,9 @@ Bus.on('clickDevice', (isParent) => {
     if (!isParent) {// 点击子级
         var clickName = bimStore().activateDevice.clickName;
         var Floor = scene.getObjectByName(clickName);
+        boxLight(Floor);
         // 拉近距离
-        nearCamera(Floor);
+        // nearCamera(Floor);
         return;
     }
 })
@@ -74,7 +79,8 @@ const init = () => {
     // 相机
     camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 0.1, 1000);
     // camera.position.z = 5;  
-    camera.position.set(-20.650, 5.456, 30.088);
+    camera.position.set(-92.650, 67.456, 38.088);
+    // camera.position.set(-92.936, 180.990, -28.179);
     //渲染器
     renderer = new THREE.WebGLRenderer({ antialias: true });
     renderer.setPixelRatio(window.devicePixelRatio);
@@ -101,6 +107,7 @@ const renderScene = () => {
     TWEEN.update();
     controls.update();
     renderer.render(scene, camera);
+    labelRenderer.render(scene, camera);
     // if (roamdObjects.length > 0) {
     //     const currentModel = roamdObjects.shift();
     //     setTimeout(() => {
@@ -173,7 +180,12 @@ const onMouseDown = (event) => {
         const clickedObject = intersects[0].object;
         var selectedObject = isSelent(clickedObject);
         console.log(selectedObject);
-        if (selectedObject) {
+        boxLight(selectedObject);
+    }
+}
+
+const boxLight = (selectedObject) => {
+    if (selectedObject) {
             selectedObjects[0] = selectedObject;
             if (selectBoxByClick) {
                 scene.remove(selectBoxByClick);
@@ -182,7 +194,6 @@ const onMouseDown = (event) => {
             scene.add(selectBoxByClick);
             centerSelectedGroup(selectedObject);
         }
-    }
 }
 // 居中显示选中
 const centerSelectedGroup = (obj) => {
@@ -249,17 +260,19 @@ const nearCamera = (floor) => {
 }
 //标签
 const setLabel = () => {
-    if(isAddLabel) {
+    if(isAddLabel.value) {
         addLabel();
     } else {
         removeLabel();
+        toHomeView();
     }
-    isAddLabel = !isAddLabel;
+    isAddLabel.value = !isAddLabel.value;
 }
 // 添加标签
 const addLabel = () => {
     let obj = scene.getObjectByName('set2');
-    console.log(123, obj);
+    // console.log(123, obj);
+    centerSelectedGroup(obj);
     let text = "设备二";
     let pointLabel = createLableObj(text);
     obj.add(pointLabel);
@@ -298,10 +311,10 @@ const removeLabel = () => {
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    cursor: pointer;
     color: #ffff;
 
     >div {
+        cursor: pointer;
         background: #477efa;
         width: 120px;
         height: 40px;
@@ -317,8 +330,7 @@ const removeLabel = () => {
     padding: 5px 10px;
     white-space: nowrap;
     background-color: #ffffffb3;
-    border-top-right-radius: 12px;
+    border-radius: 12px;
-    border-bottom-right-radius: 12px;
     font-size: 12px;
     display: flex;
     flex-direction: column;

src/views/bim/bimHome/index.vue

@@ -49,7 +49,6 @@ import ApplicationTree from './components/ApplicationTree.vue';
 import EquipmentInfo from './components/EquipmentInfo.vue';
 import RealData from './components/RealData.vue';
 import ThreeView from './components/ThreeView2.vue';
-// import ThreeModel from './components/ThreeModel.vue';
 import DeviceInfoDialog from './components/DeviceInfoDialog.vue';
 import RealInfoDialog from './components/RealInfoDialog.vue';
 import DeviceDetial from './components/DeviceDetial.vue';

src/views/index.vue

@@ -67,7 +67,7 @@ const gotoPage = (item) => {
   .home-page {
     width:100%;
     height: calc(100vh - 150px);
-    background: #020c45;
+    background: #000000;
     position: relative;
     .map-div {
       width: 100%;