【问题标题】:Three.js raycasting object selection with animationThree.js 带有动画的光线投射对象选择
【发布时间】:2016-04-05 11:42:00
【问题描述】:

光线投射选择在我的静态网格项目中运行良好,但对于动画网格,光线选择似乎看不到网格的移动,只响应网格的非动画(原始)位置。

我的选择代码如下:

element.addEventListener( 'mouseup', function ( event ) 
{

  var vector = new THREE.Vector3(( event.clientX / window.innerWidth ) * 2 - 1, -( event.clientY / window.innerHeight ) * 2 + 1, 0.5);
  vector = vector.unproject(camera);
  var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
  var intersects = raycaster.intersectObjects(pickable_objects, true);

  if (intersects.length > 0) 
  {
      //I change the object's material colour so that I can see the selection
  }
}

pickable_objects 是一个可选的 three.js 网格对象数组,据我所知,这些对象不携带动画信息,所以我抱怨的结果可能对某些人来说并不奇怪。

我没有在此处包含颜色更改代码或 JSON 网格阅读器代码,因为我认为这不相关。

因此,对于静态网格,光线投射非常准确,但对于动画网格,我必须单击对象的正中心或找到其原始非动画位置才能进行选择。

【问题讨论】:

    标签: javascript three.js


    【解决方案1】:

    如果您查看 github 存储库中的源代码,尤其是 Raycaster.js,您会发现实际实现在几何对象中。例如,Mesh.js 通过迭代其三角形并检查光线是否与其中任何一个相交来实现光线投射,但SkinnedMesh.js 不会覆盖此方法。

    最后,在问题页面中的快速搜索显示这实际上是一个已知限制 - https://github.com/mrdoob/three.js/issues/6440

    您似乎有 2 个选项 - 在 github 中提出问题并要求 ETA 或自己实施(希望之后发送拉取请求)。

    【讨论】:

    猜你喜欢
    • 2016-09-07
    • 1970-01-01
    • 2017-12-13
    • 1970-01-01
    • 1970-01-01
    • 2019-06-13
    • 2013-09-04
    • 2019-05-09
    • 2021-07-05
    相关资源
    最近更新 更多