three.js 简单创建一个立方体

function() {
	// 创建场景
    var scene = new THREE.Scene();
   // 创建透视型摄像机  参数(角度,长宽比,最小渲染距离,最大渲染距离)
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
    // 设置摄像机的位置参数（x,y,z）
    camera.position.set(10, 10, 10);
    camera.lookAt(2, 2, 2);
	// 创建渲染器
    var renderer = new THREE.WebGLRenderer();
    // 设置渲染器的大小
    renderer.setSize(window.innerWidth, window.innerHeight);;
    // 设置背景颜色
    renderer.setClearColor('black', 1);
    // 向body标签添加子元素renderer
    document.body.appendChild(renderer.domElement);
    // 创建立方几何体 参数（x，y，z）
    var geometry = new THREE.BoxGeometry(3, 3, 3);
    // 创建材质
    var material = new THREE.MeshBasicMaterial({ color: 'red' });
    // 创建网格对象(否则不能渲染物体)
    var cube = new THREE.Mesh(geometry, material);
    // 向场景中添加物体
    scene.add(cube);
    
	
	// 为创建的几何体创建边框辅助线
	// 创建一个边框几何体 参数（几何体，相邻面的法线之间的度数大于一个才出现边框，默认为1）
	var cubeedge = new THREE.EdgesGeometry(geometry, 1);
	// 为辅助线添加材质
    var edgematrial = new THREE.LineBasicMaterial({ color: 'blue' });
    var cubeline = new THREE.LineSegments(cubeedge, edgematrial);
    // 添加进场景
    scene.add(cubeline);

    function display() {
        renderer.render(scene, camera);
        requestAnimationFrame(display);
    }
    display();
    
}();// 无名自执行函数