首页 文章

three.js双击3d对象

提问于
浏览 次
0

Ciao，我正在努力实现这个目标：我能够知道在我的场景中双击3d对象，并设置动画摄像机位置以将对象置于屏幕中心 .

我尝试了没有成功调整使用raycaster和投影仪的交互式立方体示例...

http://www.gioblu.com/GiO/web/solarsystem/index_backup

如您所见，您可以在空间中导航并使用鼠标右键和左键更改摄像机位置 . 通过双击地球，我将能够回到初始摄像机位置（屏幕中心的地球） .

object vector three.js double-click

1 回答

  • 0

    你为什么不通过改编这个例子取得成功？发生了什么错误？你是说this的例子吗？因为raycaster和投影仪是您寻找的方式 .

    首先，您需要为容器上的ondblclick事件使用eventListener . 在事件功能中，您可以从链接的示例中复制和粘贴：

    1）保存鼠标坐标

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

    2）项目通过摄像机与世界系统进行坐标并创建射线

    var vector = new THREE.Vector3( mouse.x, mouse.y, 1 );
projector.unprojectVector( vector, camera );
raycaster.set( camera.position, vector.sub( camera.position ).normalize() );

    3）检查双击元素是否是你的星球

    var intersects = raycaster.intersectObject( "your_planet" );
if ( intersects.length > 0 ) {
    reset your camera
}

    希望这可以帮助！

    回复于

相关问题