60 lines
1.7 KiB
JavaScript
60 lines
1.7 KiB
JavaScript
export function handleLClick(targetPoint) {
|
|
this.clearTagsObj();
|
|
const worldPosition = new this.THREE.Vector3();
|
|
//获取附着点的世界坐标系
|
|
targetPoint.getWorldPosition(worldPosition);
|
|
this._checkAnimation(worldPosition);
|
|
// 显示左键属性栏
|
|
this.tag2CSS2DObj.element.style.display = "block";
|
|
// 设置标签位置
|
|
this.tag2CSS2DObj.position.set(
|
|
worldPosition.x,
|
|
worldPosition.y,
|
|
worldPosition.z
|
|
);
|
|
// 标签定位
|
|
this.tag2CSS2DObj.translateY(-15);
|
|
this.tag2CSS2DObj.translateX(15);
|
|
this.scene.add(this.tag2CSS2DObj);
|
|
intoAnimation.call(this, targetPoint);
|
|
//调用该函数回调作用返回给组件操作 very important-----
|
|
this.displayDevInfo(targetPoint);
|
|
}
|
|
|
|
// 视角进入动画
|
|
function intoAnimation(targetPoint) {
|
|
const worldP = targetPoint.getWorldPosition(new this.THREE.Vector3());
|
|
const positionOBj = this.camera.position;
|
|
|
|
const start = this.orbitControls.target;
|
|
this.intoPointAnimation = new this.TWEEN.Tween({
|
|
x: positionOBj.x,
|
|
y: positionOBj.y,
|
|
z: positionOBj.z,
|
|
xTarget: start.x,
|
|
yTarget: start.y,
|
|
zTarget: start.z,
|
|
});
|
|
|
|
this.intoPointAnimation.to(
|
|
{
|
|
x: worldP.x + 20,
|
|
y: worldP.y + 5,
|
|
z: worldP.z + 50,
|
|
xTarget: worldP.x,
|
|
yTarget: worldP.y,
|
|
zTarget: worldP.z,
|
|
},
|
|
600
|
|
);
|
|
this.intoPointAnimation.start();
|
|
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.xTarget, obj.yTarget, obj.zTarget);
|
|
});
|
|
this.intoPointAnimation.onComplete(() => {
|
|
this.camera.lookAt(worldP.x, worldP.y, worldP.z);
|
|
});
|
|
}
|