在上一章节中，有简单的提到了three.js中的三大组件以及利用three.js怎么渲染到网页上的步骤，在这里没有对什么是webgl以及three.js进行讲解，如果对于这两概念不清楚的，烦请自行度娘；
下面将贴出前一文章中的各个步骤的核心代码；
1：创建场景（scene）:
var scene=new THREE.Scene(); //通过调用THREE.JS的Scene()方法创建一个场景；
2：创建相机（camera）:
var camera=new THREE.PerspectiveCamera(45,width/height,1,1000); //创建一个相机
camera.position.set(x,y,z); //设置相机在空间中的位置；
参数详解：
fov:相机视椎体垂直角度；aspect相机视椎体宽高比；near:相机视椎体近裁剪面；
far:相机视椎体远裁剪面;
3：创建渲染器（renderer）;
var renderer=new THREE.WebGLRenderer(parametres)；
renderer.setSize(width,height); //用于设置画布的大小，如果没有设置该值的话，渲染出来的画布大小将是canvas默认的大小，即width=300,height=150;
document.body.appendChild(renderer.domElement);//用于确定渲染器挂载到网页中的那个节点中；
参数详解： parametres是一个可选的对象，在这里提一下，parametres这个对象中，有个antialias属性，该属性的作用是：是否开启反锯齿，所以该属性是一个boolean类型，默认值为false，建议一般将该值设置为true（自己一开始学习的时候，对于各个参数了解的不深，所以导致一开始没有设置该值，所以在做出来的效果中，页面会出现各种锯齿，导致页面很难看，这也算在学习过程中踩的一个坑吧
）；
4：最后使用渲染器的render方法将场景渲染到页面中：
renderer.render(scene,camera);
5：在调用渲染器的渲染方法进行渲染的时候，为了使得画面能够一直渲染进去，需要不断的调用渲染器的方法；所以对于第四步骤，可以写成如下所示：
funciton loop(){
renderer.render(scene,camera);
requestAnimationFrame(loop)
}
在这里使用h5的requestAnimationFrame()方法来定时刷新loop方法，requestAnimationFrame与传统的setInterval方法类似，不过它们之间还是存在一些区别的，关于它们之间的区别，这里就不详说了，有疑问的可以自行百度。