07three.js太阳系模拟1

7274681-f8c22d23dee1d986.png
image.png

太阳系,嗯,是的,瞎掰的就是9个不同颜色的球球。
外面的8个都绕着中间的红色的太阳做圆周运行。
什么周期、半径、距离都是假的。因为实际的太阳系比例非常丧心病狂。你们感受一下。
本节代码没有什么特别的地方,都是复习前面的内容。代码也是最原始的。
太阳系
打开网页键盘右键不停的按就看到了。

7274681-180e2bc089581e75.png
image.png

7274681-42445f9668018908.png
image.png

    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,0.1,1000);
    camera.position.set(-30,30,40);
    camera.lookAt(scene.position);

    var renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth,window.innerHeight);
    renderer.setClearColor('#363636');

    function drawSphere(x,y,z,r,colorS) {
        var sphereGeometry = new THREE.SphereGeometry(r,20,20);
        var sphereMaterial = new THREE.MeshLambertMaterial({
            color:colorS
        });
        var sphere = new THREE.Mesh(sphereGeometry,sphereMaterial);
        sphere.position.x = x;
        sphere.position.y = y;
        sphere.position.z = z;
        scene.add(sphere);
        return sphere;
    }

    sphere1 = drawSphere(0,0,0,4,0xFF0000);
    sphere2 = drawSphere(8,0,0,1.5,0xFFFF00*Math.random());
    sphere3 = drawSphere(12,0,0,1,0xFFFF00*Math.random());
    sphere4 = drawSphere(15,0,0,1.2,0xFFFF00*Math.random());
    sphere5 = drawSphere(18,0,0,1.4,0xFFFF00*Math.random());
    sphere6 = drawSphere(22,0,0,1.3,0xFFFF00*Math.random());
    sphere7 = drawSphere(25,0,0,2.3,0xFFFF00*Math.random());
    sphere8 = drawSphere(29,0,0,2.1,0xFFFF00*Math.random());
    sphere9 = drawSphere(33,0,0,1.9,0xFFFF00*Math.random());


    var ambientLight = new THREE.AmbientLight('#222222');
    scene.add(ambientLight);
    var spotLight = new THREE.SpotLight(0xFFFFFF);
    spotLight.position.set(-40,80,-40);
    scene.add(spotLight);

    document.body.appendChild(renderer.domElement);

    renderer.render(scene,camera);

    var speed2 = 2*Math.PI*Math.random();
    var speed3 = 2*Math.PI*Math.random();
    var speed4 = 2*Math.PI*Math.random();
    var speed5 = 2*Math.PI*Math.random();
    var speed6 = 2*Math.PI*Math.random();
    var speed7 = 2*Math.PI*Math.random();
    var speed8 = 2*Math.PI*Math.random();
    var speed9 = 2*Math.PI*Math.random();
    function run() {
        speed2 += 0.014/2;
        speed3 += 0.022/2;
        speed4 += 0.034/2;
        speed5 += 0.031/2;
        speed6 += 0.034/2;
        speed7 += 0.044/2;
        speed8 += 0.047/2;
        speed9 += 0.049/2;
        sphere2.position.x = 8*Math.cos(speed2);
        sphere2.position.z = 8*Math.sin(speed2);
        sphere3.position.x = 12*Math.cos(speed3);
        sphere3.position.z = 12*Math.sin(speed3);
        sphere4.position.x = 15*Math.cos(speed4);
        sphere4.position.z = 15*Math.sin(speed4);
        sphere5.position.x = 18*Math.cos(speed5);
        sphere5.position.z = 18*Math.sin(speed5);
        sphere6.position.x = 22*Math.cos(speed6);
        sphere6.position.z = 22*Math.sin(speed6);
        sphere7.position.x = 25*Math.cos(speed7);
        sphere7.position.z = 25*Math.sin(speed7);
        sphere8.position.x = 29*Math.cos(speed8);
        sphere8.position.z = 29*Math.sin(speed8);
        sphere9.position.x = 33*Math.cos(speed9);
        sphere9.position.z = 33*Math.sin(speed9);
        renderer.render(scene,camera);
        requestAnimationFrame(run);
    }
    run();

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

X01动力装甲

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值