2016-04-02 22 views
2

Üç janda orbitControls'e nasıl bir dönüş ekleyebileceğimi öğrenmek için internette araştırıyorum.Threejs OrbitControls ve Tween

Gerçek Hedefleri:

  1. fare hareketi dayanarak bir nesne etrafında bir kamera döndürün.
  2. Tween hafifletilmesi pürüzsüz kamera için hareket

Sadece animasyon döngüde Kamera konumunu hareket ettirerek 2. elde edebilirsiniz, ama nesnenin iken etrafında kamerayı hareket ettirmek için matematik aşina değilim onu bir merkez noktasında açarak (yörüngede). Bu # 2 çözüldü, ama # 1

Diğer orbitControls # 1 başarır, ancak güncelleştirmeye bir ara doldurma eklemek için denetimleriyle nasıl etkileşimde bulunacağından emin değilim.

Teşekkürler! Michael

cevap

0

Herhangi bir nesneyi basitçe sinüs ve kosinüs kullanarak döndürebilirsiniz. Bir targetPosition (veya hedef nesne) seçersiniz ve çalışma zamanında camera.position ve lookAt yöntemini güncelleştirirsiniz. y yerine z eklediğim nedeni, dikey olarak değil, derinlemesine döndürmek istediğinizi varsayıyorum. Math.cos ve Math.sin'un içinde bir zaman referansı var ve dönme hızını değiştirmek için bununla oynayabilirsiniz.

var targetPosition = new THREE.Vector2(100, 100); 
var radius = 50; 

function update() { 
    requestAnimationFrame(update); 
    camera.position.x = targetPosition.x + Math.cos(Date.now()/1000) * radius; 
    camera.position.z = targetPosition.y + Math.sin(Date.now()/1000) * radius; 
    camera.lookAt(targetPosition); 
} 

sadece bir hedef THREE.Vector3 ve sadece ara oluşturduğunuzda gereken kullanıcı (örneğin) bir düğmeye tıkladığında, pozisyon B'ye A pozisyonundan Arayı yapmak wan't istenen pozisyona vektör, ve üzerinde sadece

var cameraPosition = new THREE.Vector3(); 

window.addEventListener('click', handleClick, false); 

function handleClick(e) { 
    TweenMax.to(cameraPosition, 1, { x: 100, y: 100, z: 100 }); 
} 

function update() { 
    requestAnimationFrame(update); 
    camera.position.copy(cameraPosition); 
} 
İlgili konular