threejs 地球贴图

three.js是一个用于在网页上创建3D图形的JavaScript库。在three.js中，我们可以使用贴图将图像贴在3D几何体上，包括地球。

要在three.js上创建一个地球贴图，我们需要准备一个地球的纹理图像。可以通过搜索引擎或者自己制作一个地球纹理图像。接下来，我们需要用three.js的纹理加载器将该图像加载到代码中。

例如，我们可以使用以下代码加载地球贴图：

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

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

var renderer = new THREE.WebGLRenderer(); // 创建渲染器
renderer.setSize(window.innerWidth, window.innerHeight); // 设置渲染器大小
document.body.appendChild(renderer.domElement); // 将渲染器添加到HTML页面

var textureLoader = new THREE.TextureLoader(); // 创建纹理加载器
var texture = textureLoader.load('path/to/earth_texture.jpg'); // 加载地球纹理图像

var geometry = new THREE.SphereGeometry(1, 32, 32); // 创建球体几何体
var material = new THREE.MeshBasicMaterial({ map: texture }); // 创建材质并将纹理赋给材质
var earth = new THREE.Mesh(geometry, material); // 创建地球网格

scene.add(earth); // 将地球添加到场景中

function animate() {
    requestAnimationFrame(animate);

    earth.rotation.y += 0.01; // 旋转地球

    renderer.render(scene, camera); // 渲染场景和相机
}

animate();

在以上代码中，我们使用`THREE.SphereGeometry`创建一个球体几何体，然后使用`THREE.MeshBasicMaterial`创建一个基本材质，并将地球纹理赋给材质。最后，我们将球体几何体和材质创建一个网格，并将网格添加到场景中。

通过控制`earth.rotation.y`的值，我们可以让地球旋转起来。最后，在`animate`函数中，我们使用`requestAnimationFrame`动画帧来不断调用`animate`函数并渲染场景，使得地球可以旋转。

以上是使用three.js创建地球贴图的基本步骤。可以根据自己的需求进行扩展和修改。