这是今天要分析的官网demo，这是源码。初始化相机，场景后，这次还初始化了两种光源。 // 初始化环境光照，表示环境的基础亮度，参数1为光源颜色，参数2为光源强度 // 环境光在没有物体的情况下没用 // 不透明物体的颜色是反射光的颜色，在初始化纹理处可设置ambient属性，表示物体反射环境光的能力 var ambientLight = new THREE.AmbientLight( 0xcccccc, 0.5 ); scene.add( ambientLight ); // 初始化点光源，参数为颜色，亮度，照射的最远距离 var pointLight = new THREE.PointLight( 0xffffff, 0.8 );具体可以看入门指南中的光与影，另外除了光，你还需要了解光对不同材质的作用才能很好的得到你想要的效果，对于这一点，入门指南中材质章节有很好的解释。大致的意思如下：BasicMaterial-基础材质直接用color属性设置材质颜色，不会受光照影响，不会有高光阴影部分。MeshLambertMaterial-漫反射材料，颜色主要为光照在物体上漫反射到我们眼睛中的颜色，color属性表示物体对散射光的反射能力，如果光源为白光0xffffff，color设置为0x00ff00，即能反射绿光，那么物体就会呈现绿色，而如果光源为红光，那么物体就不会反射光，表现为黑色。emissive表现物体自发光的能力，一般在反射光弱的地方（如背光部分）会比较明显。ambient表示材料对环境光的反射能力，环境光一般是给场景一个基础的光亮，要与其他光源区别开来。MeshPhongMaterial-phone材质，有镜面反射的效果。其他属性与漫反射材质一样，有两个独有的属性，specular和shininess，specular表示镜面反射部分对光的反射能力。shininess控制高光的光斑的大小。然后回到源码 // 将点光源作为相机的子对象，点光源的位置即相机的位置 camera.add( pointLight ); scene.add( camera );文档中说可以通过.add( object )方法来将对象进行组合，该方法将对象添加为子对象camera继承自object3D，用这个属性将点光源添加为子对象，然后点光源的位置就会随相机的位置改变，就像你拿着一个手电筒一样。 // 加载纹理 var map = new THREE.TextureLoader().load( ’textures/UV_Grid_Sm.jpg’ ); // wrapS表示纹理在水平方向如何包裹，wrapT表示在垂直方向,使用RepeatWrapping，纹理将简单地重复到无穷大 ?? map.wrapS = map.wrapT = THREE.RepeatWrapping; // 沿着轴，通过具有最高纹素密度的像素的样本数 ?? map.anisotropy = 16; // 初始化Phong网孔材料，具有镜面高光的光泽表面 var material = new THREE.MeshPhongMaterial( { map: map, side: THREE.DoubleSide } );加载纹理这部分我不是很理解，感兴趣可以看下官网。然后是构建几何体部分，推荐看入门指南中的基础几何形状和官网。其中比较有趣的是 // 构建二维对象数组 var points = []; for ( var i = 0; i < 50; i ++ ) { points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * Math.sin( i * 0.1 ) * 15 + 50, ( i - 5 ) * 2 ) ); } // 车床几何体，由二维对象数组形成的曲线绕x轴旋转一周获得 object = new THREE.Mesh( new THREE.LatheBufferGeometry( points, 20 ), material ); object.position.set( - 100, 0, - 200 ); scene.add( object );这个可以用来构造花瓶等曲面轴对称物体，其中的二维对象数组就像我们学的一元函数一样，在坐标系中可以表示出各种曲线，然后绕x轴旋转一周得到立体图形。这个的关键就是怎么得到你想要形状的数学表达式，这个就需要数学功底了，不知道有没有画一条线就能得到近似表达式的软件。 // 对该对象和子对象应用的回调函数 scene.traverse( function ( object ) { // 如果对象为网格对象 if ( object.isMesh === true ) { object.rotation.x = timer * 5; object.rotation.y = timer * 2.5; } } );这个traverse方法也是继承自object3D，这里用来给场景中的所有mesh物体加上循环调用的函数，使其不断旋转。下面是最近搜集的好资料three.js学习群群主的博客，相当详细。https://blog.csdn.net/qq_3010…three.js正统的学习网站 http://learningthreejs.com/挺详细的博文 https://www.cnblogs.com/cathe…有人写的文档 https://teakki.com/p/58a3ef1b…对光源的讲解 http://www.hangge.com/blog/ca…