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){
});