用Three.js根据两个三维点创建Cylinder

本文主要是介绍用Three.js根据两个三维点创建Cylinder，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

Three.js中默认不能直接根据两个三维点的坐标创建Cylinder，创建的Cylinder默认是垂直于XOY平面的，不便于实际应用，下面是用Three.js根据两个三维点创建Cylinder:

function createCylinderMesh(x1,y1,z1,x2,y2,z2){		var x0 = (x1 + x2) / 2;var y0 = (y1 + y2) / 2;var z0 = (z1 + z2) / 2;var p1 = new THREE.Vector3(x1,y1,z1);var length = Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2) + (z1 - z2) * (z1 - z2));var material = new THREE.MeshBasicMaterial( { color: 0x0000ff } );var geometry = new THREE.CylinderGeometry(3,3,length);geometry.applyMatrix( new THREE.Matrix4().setRotationFromEuler( new THREE.Vector3( Math.PI / 2, Math.PI, 0 ) ) );var mesh = new THREE.Mesh(geometry,material);mesh.position.set(x0, y0, z0);		mesh.lookAt(p1);return mesh;}

上面代码的关键部分是 geometry.applyMatrix( new THREE.Matrix4().setRotationFromEuler( new THREE.Vector3( Math.PI / 2, Math.PI, 0 ) ) );和 mesh.lookAt(p1);

其中mesh.lookAt(p1)中的p1指的是该Cylinder两个端点中的任意一个，意思是，从Cylinder的中心点朝着其中一个端点看去，自然就使得Cylinder的方向调整到正确方向了。

附图一张：

这篇关于用Three.js根据两个三维点创建Cylinder的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---