tremble 2 anni fa
parent
commit
c26bd0176b
3 ha cambiato i file con 83 aggiunte e 40 eliminazioni
  1. 8 2
      public/package/js/label.js
  2. 11 12
      public/package/js/objViewer.js
  3. 64 26
      src/views/Home_pc.vue

+ 8 - 2
public/package/js/label.js

@@ -32,7 +32,7 @@ class Label2D extends THREE.EventDispatcher {
 
         this.elem.css({ position: 'absolute', 'z-index': 999 })
         this.clickFun = o.clickFun;
-        this.clickFun && this.elem.on('click', this.clickFun.bind(this))
+        this.clickFun && this.elem.on('click', this.clickFun.bind(this,o))
 
         {
             let update = (e) => {
@@ -69,7 +69,13 @@ class Label2D extends THREE.EventDispatcher {
 
         var p = convertTool.getPos2d(this.position, viewer.camera, $("#player")[0]);
         this.pos2d = p.vector;
-        
+
+
+        if (this.pos2d.x>0) {
+            this.elem.addClass('right')
+          } else{
+            this.elem.removeClass('right')
+          }
         
         if (!p || !p.trueSide) {
             this.elem.css('display', 'none'); return;

+ 11 - 12
public/package/js/objViewer.js

@@ -170,19 +170,18 @@ Viewer.prototype.animate = function () {
     if (changed.cameraChanged) {
         this.dispatchEvent({ type: 'view.changed', changeSlightly: changed.changeSlightly })
         delayNeedUpdated = true
-        
-        if( !transitions.funcs.some(function (e) { return e.name === 'cameraFly' })){
-            convertTool.intervalTool.isWaiting('delayUpdate', ()=>{ //延时update,防止卡顿
-                if(delayNeedUpdated){  
-                    delayNeedUpdated = false 
-                    this.dispatchEvent({ type: 'delayUpdate'  }) 
-                    console.log('delayUpdate')                
-                    return true 
-                } 
+
+        if (!transitions.funcs.some(function (e) { return e.name === 'cameraFly' })) {
+            convertTool.intervalTool.isWaiting('delayUpdate', () => { //延时update,防止卡顿
+                if (delayNeedUpdated) {
+                    delayNeedUpdated = false
+                    this.dispatchEvent({ type: 'delayUpdate' })
+                    return true
+                }
             }, 200)
         }
-        
-        
+
+
         let label_ = this.labels.filter(e => e.elem[0].style.display == 'block')
         label_.sort((a, b) => b.pos2d.z - a.pos2d.z)
         label_.forEach((e, index) => e.elem.css('z-index', index + 1000));
@@ -256,7 +255,7 @@ Viewer.prototype.animate = function () {
                                             }
                                             child.material.emissiveIntensity += 0.01 * step;
                                         }
-                                        else{
+                                        else {
                                             child.material.emissiveMap = emissiveTexture;
                                             child.material.emissiveIntensity = 0;
                                         }

+ 64 - 26
src/views/Home_pc.vue

@@ -38,6 +38,21 @@ import vintroduce from "@/components/introduce";
 
 const transitionTime = 2000
 
+let labelClick = (e) => {
+  if (e.centerCamePosi) {
+    let { x, y, z } = e.centerCamePosi
+    window.transitions.start(
+      window.lerp.vector(window.viewer.camera.position,
+        new window.THREE.Vector3(x, y, z)),
+      transitionTime,
+      () => { },
+      0/* Delay */,
+      window.easing.easeInOutQuad,
+      'cameraFly');
+  }
+}
+
+
 let infoLabels = [{ "title": "宝珠钮", "posInModel": [-4.6302, 20.0953, 2.9731] },
 { "title": "瓶身", "posInModel": [-11.7969, -1.7939, 3.9055] },
 { "title": "瓶盖", "posInModel": [-6.0636, 16.2615, 3.4633] }]
@@ -53,7 +68,13 @@ let picLabels = [
       -9.9383,
       1.517,
       8.4702
-    ]
+    ],
+    "centerCamePosi": {
+      x: -0.4650665393060424,
+      y: 0.0106499843061736,
+      z: 0.43269467554899155,
+    },
+    clickFun: labelClick
   },
   {
     "title": "牡丹",
@@ -66,7 +87,13 @@ let picLabels = [
       -10.5926,
       -6.1392,
       1.8685
-    ]
+    ],
+    "centerCamePosi": {
+      x: -0.5357516927819861,
+      y: -0.3176574374999963,
+      z: 0.1252552053945424
+    },
+    clickFun: labelClick
   },
   {
     "title": "梅",
@@ -79,7 +106,13 @@ let picLabels = [
       12.4014,
       5.4827,
       2.9209
-    ]
+    ],
+    "centerCamePosi": {
+      x: 0.5882886392634421,
+      y: 0.2267149762544653,
+      z: 0.07836955309150107
+    },
+    clickFun: labelClick
   },
   {
     "title": "松",
@@ -91,11 +124,18 @@ let picLabels = [
       -5.2427,
       1.903,
       -12.1582
-    ]
+    ],
+    "centerCamePosi": {
+      x: -0.2604583387784285,
+      y: 0.00816509249833358,
+      z: -0.5794133027654209
+    },
+    clickFun: labelClick
   }
 ]
 
 
+
 export default {
   components: { vmenu, Loading, vintroduce },
   data() {
@@ -258,9 +298,9 @@ export default {
         wlmesh.material.dispose();
       }
     },
-    currentItem(newVal){
+    currentItem(newVal) {
       if (newVal != 'pix') {
-          window.showWenli = false
+        window.showWenli = false
       }
     }
   },
@@ -291,25 +331,22 @@ export default {
       window.viewer.control.minPolarAngle = 0;
     })
 
-
-
- 
-    window.viewer.addEventListener("delayUpdate", (e) => { 
-        setTimeout(() => { 
-          if (this.currentItem == 'pic') {
-            let centerLabel = window.viewer.getCLabel()
-            if (centerLabel) {
-              window.viewer.labels.forEach(item => {
-                if (centerLabel.title == item.title) {
-                  this.centerLabel = centerLabel
-                }
-                else {
-                  item.elem.removeClass('detailShow')
-                }
-              })
-            }
-          } 
-        }); 
+    window.viewer.addEventListener("delayUpdate", (e) => {
+      setTimeout(() => {
+        if (this.currentItem == 'pic') {
+          let centerLabel = window.viewer.getCLabel()
+          if (centerLabel) {
+            window.viewer.labels.forEach(item => {
+              if (centerLabel.title == item.title) {
+                this.centerLabel = centerLabel
+              }
+              else {
+                item.elem.removeClass('detailShow')
+              }
+            })
+          }
+        }
+      });
     })
 
   },
@@ -602,7 +639,8 @@ export default {
     }
 
     &.detailShow {
-      z-index: 1088!important;
+      z-index: 1088 !important;
+
       &:after {
         content: "";
         background-image: url('~@/assets/images/point_active.svg');