threejs 八大行星公转自转

以下是使用Three.js实现八大行星公转自转的代码示例：

// 创建场景
var scene = new THREE.Scene();

// 创建相机
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 50;

// 创建渲染器
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// 创建太阳
var sunGeometry = new THREE.SphereGeometry(10, 32, 32);
var sunMaterial = new THREE.MeshBasicMaterial({ color: 0xffff00 });
var sun = new THREE.Mesh(sunGeometry, sunMaterial);
scene.add(sun);

// 创建八大行星
var mercuryGeometry = new THREE.SphereGeometry(1, 32, 32);
var mercuryMaterial = new THREE.MeshBasicMaterial({ color: 0x888888 });
var mercury = new THREE.Mesh(mercuryGeometry, mercuryMaterial);
mercury.position.x = 20;
scene.add(mercury);

var venusGeometry = new THREE.SphereGeometry(2, 32, 32);
var venusMaterial = new THREE.MeshBasicMaterial({ color: 0xff8800 });
var venus = new THREE.Mesh(venusGeometry, venusMaterial);
venus.position.x = 30;
scene.add(venus);

var earthGeometry = new THREE.SphereGeometry(3, 32, 32);
var earthMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff });
var earth = new THREE.Mesh(earthGeometry, earthMaterial);
earth.position.x = 40;
scene.add(earth);

var marsGeometry = new THREE.SphereGeometry(2, 32, 32);
var marsMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 });
var mars = new THREE.Mesh(marsGeometry, marsMaterial);
mars.position.x = 50;
scene.add(mars);

var jupiterGeometry = new THREE.SphereGeometry(6, 32, 32);
var jupiterMaterial = new THREE.MeshBasicMaterial({ color: 0xffcc00 });
var jupiter = new THREE.Mesh(jupiterGeometry, jupiterMaterial);
jupiter.position.x = 70;
scene.add(jupiter);

var saturnGeometry = new THREE.SphereGeometry(5, 32, 32);
var saturnMaterial = new THREE.MeshBasicMaterial({ color: 0xcc9900 });
var saturn = new THREE.Mesh(saturnGeometry, saturnMaterial);
saturn.position.x = 90;
scene.add(saturn);

var uranusGeometry = new THREE.SphereGeometry(4, 32, 32);
var uranusMaterial = new THREE.MeshBasicMaterial({ color: 0x00ffff });
var uranus = new THREE.Mesh(uranusGeometry, uranusMaterial);
uranus.position.x = 110;
scene.add(uranus);

var neptuneGeometry = new THREE.SphereGeometry(3, 32, 32);
var neptuneMaterial = new THREE.MeshBasicMaterial({ color: 0x000099 });
var neptune = new THREE.Mesh(neptuneGeometry, neptuneMaterial);
neptune.position.x = 130;
scene.add(neptune);

// 创建光源
var light = new THREE.PointLight(0xffffff, 1, 0);
light.position.set(0, 0, 0);
scene.add(light);

// 动画循环
function animate() {
    requestAnimationFrame(animate);

    // 太阳自转
    sun.rotation.y += 0.01;

    // 水星公转自转
    mercury.rotation.y += 0.01;
    mercury.position.x = 20 * Math.cos(Date.now() * 0.0005);
    mercury.position.z = 20 * Math.sin(Date.now() * 0.0005);

    // 金星公转自转
    venus.rotation.y += 0.01;
    venus.position.x = 30 * Math.cos(Date.now() * 0.0004);
    venus.position.z = 30 * Math.sin(Date.now() * 0.0004);

    // 地球公转自转
    earth.rotation.y += 0.01;
    earth.position.x = 40 * Math.cos(Date.now() * 0.0003);
    earth.position.z = 40 * Math.sin(Date.now() * 0.0003);

    // 火星公转自转
    mars.rotation.y += 0.01;
    mars.position.x = 50 * Math.cos(Date.now() * 0.0002);
    mars.position.z = 50 * Math.sin(Date.now() * 0.0002);

    // 木星公转自转
    jupiter.rotation.y += 0.01;
    jupiter.position.x = 70 * Math.cos(Date.now() * 0.0001);
    jupiter.position.z = 70 * Math.sin(Date.now() * 0.0001);

    // 土星公转自转
    saturn.rotation.y += 0.01;
    saturn.position.x = 90 * Math.cos(Date.now() * 0.00005);
    saturn.position.z = 90 * Math.sin(Date.now() * 0.00005);

    // 天王星公转自转
    uranus.rotation.y += 0.01;
    uranus.position.x = 110 * Math.cos(Date.now() * 0.00003);
    uranus.position.z = 110 * Math.sin(Date.now() * 0.00003);

    // 海王星公转自转
    neptune.rotation.y += 0.01;
    neptune.position.x = 130 * Math.cos(Date.now() * 0.00002);
    neptune.position.z = 130 * Math.sin(Date.now() * 0.00002);

    renderer.render(scene, camera);
}

animate();