threejs光线投射点击检测无法在加载的3dObject上工作
threejs raycast click detection not working on loaded 3dObject
我加载一个.obj文件:
var loader = new THREE.OBJMTLLoader();
loader.load( "../obj/machine.obj", '../obj/machine.mtl', this.loadObject);
并尝试检测点击:
click: function(event){
this.mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
this.mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
var vector = new THREE.Vector3( this.mouse.x, this.mouse.y, 1 ).unproject( this.camera );
this.raycaster.set( this.camera.position, vector.sub( this.camera.position ).normalize() );
console.log(this.scene.children);
var intersects = this.raycaster.intersectObjects( this.scene.children );
if ( intersects.length > 0 ) {
console.log("hitting something");
}
},
这在网格上效果良好,但在加载的3DObject上效果不佳,因为它在This.cene.childeren:中可见
[THREE.Mesh, THREE.Line, THREE.PointLight, --> THREE.Object3D <-- ]0: THREE.Mesh__webglActive: true__webglInit: true_listeners: Object_modelViewMatrix: THREE.Matrix4_normalMatrix: THREE.Matrix3castShadow: falsechildren: Array[0]eulerOrder: (...)frustumCulled: truegeometry: THREE.IcosahedronGeometryid: 4material: THREE.MeshBasicMaterialmatrix: THREE.Matrix4matrixAutoUpdate: truematrixWorld: THREE.Matrix4matrixWorldNeedsUpdate: falsename: ""parent: THREE.Sceneposition: THREE.Vector3quaternion: THREE.QuaternionreceiveShadow: falserenderDepth: nullrotation: THREE.EulerrotationAutoUpdate: truescale: THREE.Vector3type: "Mesh"up: THREE.Vector3useQuaternion: (...)userData: Objectuuid: "46D85379-A9CE-4221-A599-39D13EE4CB34"visible: true__proto__: Object1: THREE.Line2: THREE.PointLight3: THREE.Object3D
因此,有东西告诉我,它需要其他东西来加载3dObjects。但我不知道这可能是什么。我的想法是,光线投射会寻找相交的顶点,无论是立方体网格还是3dObject网格都无关紧要。有人有主意吗?
您需要像这样传递递归标志
var intersects = raycaster.intersectObjects( objects, true );
three.js r.69
相关文章:
- 如何使用url加载程序在webpack中导入多个图像
- 如何在生成下载文件时显示加载动画
- 有没有任何方法可以将控制器从文件加载到ui路由器$stateProvider中
- 无法在通过jQuery的ajax加载的页面中执行javascript
- Emberjs应用程序加载在除Index之外的所有路由上
- 在chrome.tabs.onCreated之后加载HTML页面
- 单击F5时如何停止页面加载
- HTML5音频加载和播放获胜'我不能在iPad上工作
- 跟踪在页面加载时应用内联样式的JavaScript
- 在使用Polymer'加载所有json文件后执行方法;s的核心ajax
- jQuery Lazy加载动画滚动
- Html页面上的多个Base64图像和平滑加载
- 如何创建带有插槽的vue js组件预加载程序
- Webpack/Rect:遵循egghead.io教程,但出现错误:您可能需要一个合适的加载程序来处理此文件类型
- 如何使该数据在所有元素中加载
- Chrome扩展没有't在重新加载之前考虑期权价值
- 使用javascript在Flash中加载外部图像
- Ajax文件加载和<输入>文件加载
- 使用javascript函数在页面初始化后加载jquery
- threejs光线投射点击检测无法在加载的3dObject上工作