var scene=new THREE.Scene();
// 创建一个场景
var geomtry=new THREE.BoxGeometry(110,0.1,100);
//创建一个物体模型 参数为 物体的 x y z 标量
var materil=new THREE.MeshLambertMaterial({color:0xff0000});
// 创建物体材质
var mesh=new THREE.Mesh(geomtry,materil);
// 创建一个物体 需要两个形参 物体模型以及材质
var mesh2=newTHREE.Mesh(geomtry,materil);
// 创建第一个 物体,
mesh.position.set(0,30,0)
// 物体1 设置位置
mesh2.position.set(0,0,0)
// 物体2 设置位置
scene.add(mesh);
//将物体添加到场景
scene.add(mesh2);
//将物体添加到场景
var light=new THREE.PointLight(0xffffff);
// 创建光源
light.position.set(300,400,200);
// 设置光源位置
scene.add(light);
//添加光源到场景中
var camera=new THREE.PerspectiveCamera(40,800/600,1,1000);
//创建 一个相机 参数分别为 相机的视角,视觉的宽高比,最近视角 ,最远视觉
camera.position.set(200,200,200);
// 设置相机的位置
camera.lookAt(scene.position);
// 设置相机的视野为 场景
varr ender=new THREE.WebGLRenderer({
antialias:true,//是否开启反锯齿
precision:"highp",//着色精度选择
alpha:true// 背景透明
});
// 创建一个渲染器
render.setClearColor(0x000000,1.0);
// 设置背景 透明 // alpha 为true 透明度才有效
render.setSize(800,600);
// 设置渲染器到 尺寸
document.body.appendChild(render.domElement);
将渲染器填充到html页面中
render.render(scene,camera)
//渲染
代码 如下
效果: