Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/458.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/three.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Three.js:将圆柱体旋转到矢量3方向_Javascript_Three.js - Fatal编程技术网

Javascript Three.js:将圆柱体旋转到矢量3方向

Javascript Three.js:将圆柱体旋转到矢量3方向,javascript,three.js,Javascript,Three.js,我已经搜索过了,但没有找到任何有用的: 我得到了一个向量和一个圆柱几何网格。我想确认,圆柱体正对着向量显示的点。作为输入,我得到一个位置(c)和一个方向(m)(就像一个直线方程:y=mx+c): 但看起来方向与我想要实现的正好相反 我也尝试过翻译之类的东西: geometry.applyMatrix(新的三个.Matrix4().makeTranslation(0,长度/2,0)) 并尝试手动获取旋转,如line.rotation.x=direction.angleTo(vec3(1,0,0))

我已经搜索过了,但没有找到任何有用的:

我得到了一个向量和一个圆柱几何网格。我想确认,圆柱体正对着向量显示的点。作为输入,我得到一个位置(c)和一个方向(m)(就像一个直线方程:y=mx+c):

但看起来方向与我想要实现的正好相反

我也尝试过翻译之类的东西:

geometry.applyMatrix(新的三个.Matrix4().makeTranslation(0,长度/2,0))

并尝试手动获取旋转,如
line.rotation.x=direction.angleTo(vec3(1,0,0))*180/Math.PI。但是没有一个像我需要的那样工作。

这对我很有用:

  // Make the geometry (of "distance" length)
  var geometry = new THREE.CylinderGeometry( 0.6, 0.6, distance, 8, 1, true );
  // shift it so one end rests on the origin
  geometry.applyMatrix( new THREE.Matrix4().makeTranslation( 0, distance / 2, 0 ) );
  // rotate it the right way for lookAt to work
  geometry.applyMatrix( new THREE.Matrix4().makeRotationX( THREE.Math.degToRad( 90 ) ) );
  // Make a mesh with the geometry
  var mesh = new THREE.Mesh( geometry, material );
  // Position it where we want
  mesh.position.copy( from.sceneObject.position );
  // And make it point to where we want
  mesh.lookAt( to.sceneObject.position );

伟大的人,非常感谢!花上几天的时间,尝试一切。。。下次我会早点问;)简短的编辑:你甚至不需要翻译(如果你想从中间开始,将它扩展到位置的两边),它就可以不用它了。@ ScLanger-Struter是这样的,但是我需要为我的应用程序精确定位(基本上画粗线)。不过,对于其他人来说,这是一个很好的观点。
  // Make the geometry (of "distance" length)
  var geometry = new THREE.CylinderGeometry( 0.6, 0.6, distance, 8, 1, true );
  // shift it so one end rests on the origin
  geometry.applyMatrix( new THREE.Matrix4().makeTranslation( 0, distance / 2, 0 ) );
  // rotate it the right way for lookAt to work
  geometry.applyMatrix( new THREE.Matrix4().makeRotationX( THREE.Math.degToRad( 90 ) ) );
  // Make a mesh with the geometry
  var mesh = new THREE.Mesh( geometry, material );
  // Position it where we want
  mesh.position.copy( from.sceneObject.position );
  // And make it point to where we want
  mesh.lookAt( to.sceneObject.position );