ThreeJS创建3D的基本步骤及相关知识

ThreeJS创建3D的基本步骤：

 

scene

创建场景

添加物体

添加光源

 

camera

创建摄像机

设置位置

//添加相机到场景中

 

renderer

创建渲染器

设置渲染器的大小

设置渲染器的背景

将渲染器的DOM元素添加到页面容器

进行渲染（renderer.render(scene, camera)）

 

-----------------------------------------

light

创建光源

设置光源的位置

添加光源到场景中

 

物体/角色

创建角色（var cube = new THREE.Mesh(geometry, material);）

添加角色到场景中

 

=========================================

光源：

 

THREE.Light(hex);//光源基类（参数hex，一个16进制的颜色值）

 

如：var redLight = new THREE.Light(0xFF0000);//红光

 

------------

常见光源有：

环境光 —— THREE.AmbientLight( hex );

点光源 —— THREE.PointLight( hex, intensity, distance );//hex：颜色，intensity：强度，distance：距离

聚光灯 —— THREE.SpotLight( hex, intensity, distance, angle, exponent );//hex：颜色，intensity：强度，distance：距离，angel：着色角度(弧度)，expoent：衰减指数

方向光 —— THREE.DirectionalLight(hex, intensity);//又称平行光。hex：颜色，intensity：强度

区域光 —— THREE.AreaLight(hex, intensity);//hex：颜色，intensity：强度

 

=========================================

纹理：

THREE.Texture( image, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy );

var texture = THREE.ImageUtils.loadTexture("textures/a.jpg",null,function(t){

        });