123

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

@@ -100,9 +100,7 @@ const init = () => {
     scene.background = new THREE.Color(bimStore().activateMenu.background);
     // 相机
     camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 0.1, 1000); 
-    // camera.position.z = 5;  
     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);
@@ -121,9 +119,7 @@ const loadSence = () => {
     gltfLoader.setDRACOLoader(dracoLoader)
     gltfLoader.load('/jzc/scene3.gltf', (gltf) => {
         var model = gltf.scene; 
-        // console.log(roamdObjects);
         roamdObjects = model.children[0].children; 
-        // console.log(model.children[0].children);
         scene.add(model);
     });
 };
@@ -133,12 +129,6 @@ const renderScene = () => {
     controls.update();
     renderer.render(scene, camera);
     labelRenderer.render(scene, camera);
-    // if (roamdObjects.length > 0) {
-    //     const currentModel = roamdObjects.shift();
-    //     setTimeout(() => {
-    //         roam(currentModel);
-    //     }, 3000);
-    // }
 };
 
 const onWindowResize = () => {
@@ -203,36 +193,20 @@ const onMouseMove = (event) => {
 }
 // 鼠标点击效果
 const onMouseDown = (event) => {
-    var vector = new THREE.Vector3();//三维坐标对象
+    var raycaster = new THREE.Raycaster()
-    vector.set(
+    mouse.x = ((event.clientX - marginLeft) / window.innerWidth) * 2 - 1;
-        (event.clientX / window.innerWidth) * 2 - 1,
+    mouse.y = -((event.clientY - marginTop) / window.innerHeight) * 2 + 1;
-        - (event.clientY / window.innerHeight) * 2 + 1,
+    raycaster.setFromCamera(mouse, camera);
-        0.5);
+    const intersects = raycaster.intersectObjects(scene.children, true);
-    vector.unproject(camera);
+    console.log(123, event);
-    var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
+
-    var intersects = raycaster.intersectObjects(scene.children);
     if (intersects.length > 0) {
-        var selected = intersects[0];//取第一个物体
+        const clickedObject = intersects[0].object;
-        console.log("x坐标:" + selected.point.x);
+        console.log('这是我选中的模型', clickedObject);
-        console.log("y坐标:" + selected.point.y);
+        var selectedObject = isSelent(clickedObject);
-        console.log("z坐标:" + selected.point.z);
+        // 高亮所在区域
+        boxLight(selectedObject);
     }
-
-
-    // var raycaster = new THREE.Raycaster()
-    // mouse.x = ((event.clientX - marginLeft) / window.innerWidth) * 2 - 1;
-    // mouse.y = -((event.clientY - marginTop) / window.innerHeight) * 2 + 1;
-    // raycaster.setFromCamera(mouse, camera);
-    // const intersects = raycaster.intersectObjects(scene.children, true);
-    // console.log(123, event);
-
-    // if (intersects.length > 0) {
-    //     const clickedObject = intersects[0].object;
-    //     console.log('这是我选中的模型', clickedObject);
-    //     var selectedObject = isSelent(clickedObject);
-    //     // 高亮所在区域
-    //     boxLight(selectedObject);
-    // }
 }
 
 const boxLight = (selectedObject) => {
@@ -254,25 +228,6 @@ const centerSelectedGroup = (obj) => {
         controls.enabled = true;
     });
     tween.start();
-
-
-    // let distance = 100
-    // let angel = Math.PI / 5
-
-    // let position = {
-    //     x: targetPosition.x + Math.sin(angel) * distance,
-    //     // y: targetPosition.y,
-    //     y: targetPosition.y + Math.sin(angel) * distance,
-    //     z: targetPosition.z + Math.sin(angel) * distance,
-    // }
-
-    // let tween = new TWEEN.Tween(camera.position).to(position, 3000)
-    // let tween1 = new TWEEN.Tween(controls.target).to(targetPosition, 1000)
-
-
-    // // tween.start()
-    // tween1.start()
-
 }
 
 // 漫游
@@ -300,7 +255,7 @@ const roam = () => {
         renders();
     }, 1000);
 }
-function d(cameraCurve) {
+const d = (cameraCurve) => {
     let sphereCurve = null;
     //参考路径上取100个点，每个点上添加蓝色小球
     //做一个小0.6倍的路径添加到场景，作相机运动路径参考

src/views/components/Line.vue

@@ -38,8 +38,8 @@ const getCharts = () => {
             },
             grid: {
                 top: '24%',
-                left: '5%',
+                left: '2%',
-                right: '8%',
+                right: '2%',
                 // bottom: '2%',
                 height: '80%',
                 containLabel: true