three.js ~ example ~ Mr.doob

2012-01-05 ~

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r71/three.js"></script>

JavaScript

var camera, scene, renderer, geometry, material, mesh1, mesh2, mesh3;

init();
animate();

function init() {

    scene = new THREE.Scene();
    camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 100;   
    scene.add(camera);

    mesh1 = new THREE.Mesh(); // sphere container
    mesh2 = new THREE.Mesh(); // sphere container 
    mesh3 = new THREE.Mesh(); // sphere container     
    
    var R = 18; // radius
    var LON = 32; var LAT = 16; // approximation

    var PILAT = Math.PI/LAT;
    var PILON = 2*Math.PI/LON;

    var cos1,cos2,sin1,sin2,t1,t2;    
    var y1,y2,r1,r2,t1,t2;
    
    var plotG = new THREE.TetrahedronGeometry(0.03);
    var lineColor = new THREE.LineBasicMaterial({color: 0xaaaaaa});
	var geometry = new THREE.Geometry();

    for (var i=0; i<LAT; i++) // walk latitudes segments
    {
        t1 = Math.PI - i*PILAT;
        t2 = Math.PI - (i+1)*PILAT;

        y1 = Math.cos(t1); // 1 latitudes radius y-position;
        y2 = Math.cos(t2); // 2 latitudes radius y-position;

        r1 = Math.abs( Math.sin(t1) ); // 1 latitudes radius;
        r2 = Math.abs( Math.sin(t2) ); // 2 latitudes radius;          

        for (var j=0; j<LON; j++) // walk longitudes segments
        {
            t1 = j*PILON;
            t2 = (j+1)*PILON;

            cos1 = Math.cos(t1);
            cos2 = Math.cos(t2);
            sin1 = Math.sin(t1);
            sin2 = Math.sin(t2);
           
            geometry.vertices.push(
                new THREE.Vector3( r1*cos1, y1, r1*sin1 ),
                new THREE.Vector3( r2*cos1, y2, r2*sin1 ),
                new THREE.Vector3( r2*cos2, y2, r2*sin2 )          
            );
   
			var m1 = new THREE.Mesh( plotG );
            m1.position.set(r1*cos1, y1, r1*sin1);
            mesh1.add(m1);
            mesh3.add(m1.clone());
            
            if (j===0 && i===LAT-1) {
                var m1 = new THREE.Mesh( plotG );
               ...