threejs二维坐标与三维坐标的互转

屏幕坐标转为为空间坐标

应用场景：射线检测，使用鼠标点击屏幕，获取一个屏幕坐标A(x，y)，必须转换为空间坐标才能在threejs中使用。
示例代码：

				var mouse=new THREE.Vector2();
				mouse.x=(event.clientX/window.innerWidth)*2-1;
				mouse.y=-(event.clientY/window.innerHeight)*2+1;

设一点A在屏幕坐标中为（x,y），且在空间坐标系中的位置类似平面坐标系的第一象限为（a1,b1），则

			x=event.clientX;
			y=event.clientY;
			
			a=x-window.innerWidth/2;
			b=window.innerHeight/2-y;
			
			因空间坐标系的值分布在[-1,1]上，所有还需要进行归一化运算（标准化）
			a1=a/(window.innerWidth/2)=(2*x)/window.innerWidth-1;
			b1=b/(window.innerHeight/2)=1-(2*y)/window.innerHeight;
			
			所以最终结果整理得:
			a1=(event.clientX/window.innerWidth)*2-1;
			b1=-(event.clientY/window.innerHeight)*2+1;

同理，根据象限的正负，最后结果都能化为上式。

---

空间坐标转为屏幕坐标

应用场景：用于标记显示物体属性，如将一个三维坐标动态赋予给div标签。
示例：

			var halfWidth=window.innerWidth/2;
			var halfHeight=window.innerHeight/2;
				
			var vec3=new THREE.Vector3(x,y,z);
			var posi=vec3.project(camera);
			$("#div_1").css({
				left:posi.x*halfWidth+halfWidth,
				top:-posi.y*halfHeight+halfHeight,
			});

关键一步：vector.project(camera) ，表示将该三维坐标投影到视角相机平面上，变成一个二维坐标，结果为一个单位向量（标准向量），值的范围是[-1,1]。
证明：

			posi的结果：
			posi.x=(event.clientX/window.innerWidth)*2-1;
			posi.y=-(event.clientY/window.innerHeight)*2+1;

			求出屏幕坐标系的A(x，y)
			x=event.clientX;
			y=event.clientY;
			所以
			x=(posi.x+1)*(window.innerWidth/2);
			y=(1-posi.y)*(window.innerHeight/2);
			
			var halfWidth=window.innerWidth/2;
			var halfHeight=window.innerHeight/2;
			最后化为：
			x=posi.x*halfWidth+halfWidth；
			y=-posi.y*halfHeight+halfHeight;