odjbin/tunnel-cloud-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

唐润平：修改视角变换

Browse Source
This commit is contained in:
trp
2023-12-15 02:43:19 +08:00
parent 1884ad3db6
commit 02d9ba3ef1
5 changed files with 201 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/content/tunnelScene/editEquComp/editDialog.vue
View File

@@ -284,4 +284,7 @@ const equipment = {
}
}
}
:deep(.el-select-dropdown__wrap) {
background: greenyellow !important;
}
</style>

3
src/components/content/tunnelScene/sceneClass/demo.js
View File

@@ -164,6 +164,7 @@ export default class Demo {
// 匹配附着点(这里不适合对单个模型进行保存，批量对模型进行操作)
if (child.isMesh && /^point+/.test(child.name)) {
this.points.push(child);
console.log(child.name);
// 改变为基础材质
child.material = new this.THREE.MeshBasicMaterial();
child.scale.set(0.01, 0.01, 0.01);
@@ -316,7 +317,7 @@ export default class Demo {
this.tag3CSS2DObj.element.style.display = "none";
this.tagCSS2DObj.scale.set(0.1, 0.1, 0.1);
this.tag2CSS2DObj.scale.set(0.1, 0.1, 0.1);
this.tag3CSS2DObj.scale.set(0.025, 0.025, 0.025); //编辑框
this.tag3CSS2DObj.scale.set(0.02, 0.02, 0.02); //编辑框
this.tag3CSS2DObj.position.set(10, 0, 10);
this.tagCSS2DObj.scale.set(0.5, 0.5, 0.5);
}

36
src/components/content/tunnelScene/sceneClass/handleOrbitControlsChange/index.js
View File

@@ -6,4 +6,40 @@ export function handleEndChange(e) {
// 围绕点到照相机的位置
// console.log("结束");
// console.log(this.orbitControls.object.position);
// console.log(this.camera.position, this.position);
// console.log(
// this.camera.position.x - this.position.x,
// this.camera.position.y - this.position.y,
// this.camera.position.z - this.position.z
// );
// const cx =
// (this.scene
// .getObjectByName("point_001_br")
// .getWorldPosition(new this.THREE.Vector3()).x +
// this.scene
// .getObjectByName("point_001_bl")
// .getWorldPosition(new this.THREE.Vector3()).x) /
// 2;
// const cy =
// (this.scene
// .getObjectByName("point_001_br")
// .getWorldPosition(new this.THREE.Vector3()).y +
// this.scene
// .getObjectByName("point_001_bl")
// .getWorldPosition(new this.THREE.Vector3()).y) /
// 2;
// const cz =
// (this.scene
// .getObjectByName("point_001_br")
// .getWorldPosition(new this.THREE.Vector3()).z +
// this.scene
// .getObjectByName("point_001_bl")
// .getWorldPosition(new this.THREE.Vector3()).z) /
// 2;
// console.log(cx, cy, cz);
// console.log(
// this.scene
// .getObjectByName("point_001_tr")
// .getWorldPosition(new this.THREE.Vector3())
// );
}

52
src/components/content/tunnelScene/sceneClass/handleRLclick/handleRclick.js
View File

@@ -17,17 +17,40 @@ export function handleRClick(targetPoint) {
worldPosition.z
);
this.isControlOrbit(false);
this.tag3CSS2DObj.translateX(-3);
this.tag3CSS2DObj.translateZ(10);
this.position = worldPosition;
if (/tr$/.test(targetPoint.name)) {
this.tag3CSS2DObj.translateX(3);
this.tag3CSS2DObj.translateZ(10);
this.tag3CSS2DObj.translateY(-5);
intoAnimation.call(this, 4.31, -2.55, -10);
} else if (/tl$/.test(targetPoint.name)) {
this.tag3CSS2DObj.translateX(-3);
this.tag3CSS2DObj.translateZ(10);
this.tag3CSS2DObj.translateY(-5);
intoAnimation.call(this, -4.31, -2.55, -10);
} else if (/tc$/.test(targetPoint.name)) {
this.tag3CSS2DObj.translateX(0);
this.tag3CSS2DObj.translateZ(10);
this.tag3CSS2DObj.translateY(-8);
intoAnimation.call(this, 0, -2.55, -10);
} else if (/br$/.test(targetPoint.name)) {
this.tag3CSS2DObj.translateX(4);
this.tag3CSS2DObj.translateZ(6);
this.tag3CSS2DObj.translateY(5);
intoAnimation.call(this, 4.31, 5, -11);
} else if (/bl$/.test(targetPoint.name)) {
this.tag3CSS2DObj.translateX(-4);
this.tag3CSS2DObj.translateZ(6);
this.tag3CSS2DObj.translateY(5);
intoAnimation.call(this, -4.31, 5, -11);
}
this.scene.add(this.tag3CSS2DObj);
intoAnimation.call(this);
// 返回给编辑组件的回调函数
this.editDev(targetPoint);
}
function intoAnimation() {
function intoAnimation(x = -10, y = 3, z = -12) {
const worldP = this.targetPoint.getWorldPosition(new this.THREE.Vector3());
const positionOBj = this.camera.position;
const start = this.orbitControls.target;
@@ -38,15 +61,21 @@ function intoAnimation() {
xTarget: start.x,
yTarget: start.y,
zTarget: start.z,
ctlTargetX: 0,
ctlTargetY: 0,
ctlTargetZ: 0,
});
this.intoPointAnimation.to(
{
x: worldP.x - 10,
y: worldP.y + 3,
z: worldP.z - 12,
xTarget: worldP.x,
yTarget: worldP.y,
zTarget: worldP.z,
x: worldP.x + x,
y: worldP.y + y,
z: worldP.z + z,
xTarget: -5,
yTarget: 8.814,
zTarget: worldP.z + 30,
ctlTargetX: 0,
ctlTargetY: 0,
ctlTargetZ: 120,
},
600
);
@@ -54,6 +83,7 @@ function intoAnimation() {
this.intoPointAnimation.onUpdate((obj) => {
this.camera.position.set(obj.x, obj.y, obj.z);
this.camera.lookAt(obj.xTarget, obj.yTarget, obj.zTarget);
// this.orbitControls.target.set(obj.x, obj.y, -obj.z);
this.orbitControls.target.set(obj.xTarget, obj.yTarget, obj.zTarget);
});
}