threeJS在光标上没有网格的情况下获得真正的世界位置?

时间:2016-01-27 13:45:58

标签: javascript three.js webgl

code.js

// ...
this.width  = 2000
this.height = 2000
// ...
this.camera = new THREE.OrthographicCamera(this.width / -2, this.width / 2, this.height / 2, this.height / -2, 1, 1000 );
this.camera.position.z = 100;
this.camera.position.x = 600;
this.camera.position.y = -900;
this.raycaster = new THREE.Raycaster();
// ...
this.renderer = new THREE.WebGLRenderer({alpha: true, antialias: true});
// ...
this.mouse.x = ( event.clientX / this.renderer.domElement.width) * 2 - 1;
this.mouse.y = - ( event.clientY / this.renderer.domElement.height ) * 2 + 1;
// ...
this.raycaster.setFromCamera( this.mouse, this.camera );
  this.intersects = this.raycaster.intersectObjects( this.allElements );
  if (this.intersects.length == 0) {
 // TODO: how get real world position if don't have mesh on cursor?

JS返回实际像素位置,this.mouse返回本地位置-1..1,如果我不是&#39,如何得到x:250,y:250不是-1,1等现实世界位置; t在光标上使用网格使用相机偏移。 我使用这个:mouse.x - cameraPos.x,mouse.y + cameraPos.y并获得错误的位置。

P.S。对不起英语非常糟糕。

1 个答案:

答案 0 :(得分:0)

此代码适用于我:

let x = e.clientX - 400 + this.camera.position.x - cameraStartPos.x
let y = e.clientY - 100 + -this.camera.position.y - cameraStartPos.y

400和100我不知道,这是一种魔力!