通过球坐标在旋转球面上映射的对象在旋转中未正确对齐

时间:2019-05-31 04:15:58

标签: javascript three.js

我正在沿着球体坐标角theta和phi沿着围绕旋转球体的纬线生成一组立方体。滚动球代码如下。现在,随机生成的多维数据集沿其不需要的y轴旋转。

我尝试从滚动球获取法线并相应地对齐立方体的四元数。

function addWorld(){
    var sides=40;
    var tiers=40;
    var sphereGeometry = new THREE.SphereGeometry( worldRadius, sides,tiers);
    var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xfffafa ,shading:THREE.FlatShading} );

    rollingGroundSphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
    rollingGroundSphere.receiveShadow = true;
    rollingGroundSphere.castShadow=false;
    //rollingGroundSphere.rotation.z=-Math.PI/2;
    var sphereAxis = new THREE.AxesHelper(100);
    rollingGroundSphere.add(sphereAxis);
    scene.add( rollingGroundSphere );
    rollingGroundSphere.position.y=-48.5;
    rollingGroundSphere.position.z=2;
    rollingGroundSphere.rotation.z=Math.PI/2;
}

 function createCar() {
   var carGeometry, carMaterial, theta, phi, carVector; 
   var carAxis = [];
   var rollingGroundVector;
   carGeometry = new THREE.BoxGeometry(1,1,1);
   carMaterial = new THREE.MeshBasicMaterial({color:0xffffff});
   theta = 0;
   phi = 0;
   var maxCars = 60;
   var offset = [1.93, 0, 2.07];
   var r = worldRadius + 0.7;
   var x, y, z;
   rollingGroundVector=rollingGroundSphere.position.clone().normalize();

    for(var i=0; i < maxCars; i++){
        lane = Math.floor(Math.random()*3);
        phi = Math.PI/1.93;
        theta = Math.random()*2*Math.PI;
        x=r*Math.cos(theta)*Math.sin(phi);
        y=r*Math.cos(phi);
        z=r*Math.sin(theta)*Math.sin(phi);
        car[i] = new THREE.Mesh(carGeometry, carMaterial);
        car[i].position.set(x, y, z);
        carVector=car[i].position.clone().normalize();
        carAxis[i] = new THREE.AxesHelper(10);
        car[i].add(carAxis[i]);
    car[i].quaternion.setFromUnitVectors(carVector,rollingGroundVector);
        rollingGroundSphere.add(car[i]);
    }

}

如何使立方体不绕其y轴旋转并对齐?附有轴的屏幕截图。

enter image description here

提前谢谢。

0 个答案:

没有答案