Three.js专栏（三）、创建一个简单的3D地球

前言：

        通过上节课我们了解了Three.js的最小案例DEMO，熟悉了几个重要组成部分。这节课带领大家编写一个3D地球。Three.js专栏（二）、下载安装、Three.js的入门demo案例；_如何下载three.js文件-CSDN博客文章浏览阅读516次。一文带你了解Three.js的基础知识，创建一个3D页面吧！_如何下载three.js文件https://blog.csdn.net/weixin_44121341/article/details/131534651

一、通过纹理图渲染一个地球

1.1.创建一个纹理加载器对象TextureLoader，可以加载图片作为纹理贴图；

// 引入three.js
import * as THREE from '../../../three.js-r123/build/three.module.js';

// 创建地球mesh网格对象
// 地球半径
var R = 100;

var earth = createSphereMesh(R);

// R：地球半径
function createSphereMesh(R) {

    // 创建纹理加载器对象
    var textureLoader = new THREE.TextureLoader();

    // 加载纹理贴图
    var texture = textureLoader.load('earth.jpg');

    // 创建一个球体几何对象
    var geometry = new THREE.SphereBufferGeometry(R, 40, 40); 
  
    // 材质对象Material
    var material = new THREE.MeshLambertMaterial({
        // color: 0x00ffff,
        map: textur