カーブ上のThree.jsポジションオブジェクト

Question

スネイなVRメニューを作成しようとしています。ユーザーが見下ろしたときに、メニュー項目が円の周りのカーブの下の列にあり、同じように見えるようにしますカメラに向かって回転します。ここで

は、私はそれがほとんどである位置

var radius = 60; // radius of the circle 
    var height = 60, 
     angle = 0, 
     step = (Math.PI /2)/menuItems.length; 

menuItems.forEach(function(item,index){ 

    var menuItem = createMenuItem(item.title); 
     menuItem.position.y = - Math.round(height/2 + radius * Math.sin(angle)); 
     menuItem.position.z = Math.round(height/2 + radius * Math.sin(angle)); 
     // menuItem.rotation.x = -Math.round(Math.PI * Math.sin(angle)); 
    angle += step; 
    menu.add(menuItem); 

}) 

を計算したいくつかのコードを使用しています私の試みこれまで

そして例 http://codepen.io/bknill/pen/BLOwLj?editors=0010

とCodePenです次の段階では、それらをカメラに向かって均一な方法で回転させることです。 menuItem.lookAt（camera.position）を使用していない場合は、回転が均一ではありません。

child.lookAt（camera.position.normalize（））この

誰でも私は、彼らがカメラに直面しているので、アイテムの回転を取得し、彼らのように見える必要がある巧妙な数学を教えません」カーブに戻って？

Answer 1

オブジェクトを別のオブジェクトに向ける最も簡単な方法はlookAtです。

このメソッドには方向ベクトルが必要であり、その方向を見たいポイントではないことに注意してください。

（見たい位置 - オブジェクトの位置）.normalize（）;あなたのケースでは

：Vector3 documentationに基づいて

var dirToLookAt = new THREE.Vector3(); 
dirToLookAt.subVectors(menuItem.position, camera.position); 
// could be: dirToLookAt.subVectors(camera.position, menuItem.position); 
dirToLookAt.normalize(); 

操作。

詳細についてはthe last discussion I had about this methodをご覧ください。