Three.js 从球体中分割面答案

【问题标题】：Three.js split faces from sphereThree.js 从球体中分割面
【发布时间】：2015-03-08 23:54:43
【问题描述】：

我正在创建一个球体几何体。

geometry = new THREE.SphereGeometry( 200, 20, 10 );
material = new THREE.MeshLambertMaterial({ shading: THREE.FlatShading, color: 0xff0000 });
sphere = new THREE.Mesh(geometry, material);
scene.add( sphere );

我想要的是当我点击这个几何图形时，面会像下面的示例一样分离。（点击球体按钮查看分离的面） http://www.mrdoob.com/lab/javascript/threejs/css3d/periodictable/

【问题讨论】：

参见，例如，threejs/examples/webgl_geometry_tessellation.html。但是在示例中，您必须更改一行以使其正常工作：uniforms.amplitude.value = 10 * Math.sin( time * 0.5 ); 该程序正在运行，但效果不可见，因为更改太小了。

标签： javascript 3d three.js geometry

【解决方案1】：

您发布的示例的完整代码可在此处获得：http://jsfiddle.net/9XGuK/4/

具体来说，这部分例子：

var vector = new THREE.Vector3();

    for ( var i = 0, l = objects.length; i < l; i ++ ) {

        var phi = Math.acos( -1 + ( 2 * i ) / l );
        var theta = Math.sqrt( l * Math.PI ) * phi;

        var object = new THREE.Object3D();

        object.position.x = 800 * Math.cos( theta ) * Math.sin( phi );
        object.position.y = 800 * Math.sin( theta ) * Math.sin( phi );
        object.position.z = 800 * Math.cos( phi );

        vector.copy( object.position ).multiplyScalar( 2 );

        object.lookAt( vector );

        targets.sphere.push( object );

    }

也许您可以在本地重新创建此代码以更好地了解其工作原理，然后对其进行调整以满足您的需求。

【讨论】：