<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>My first three.js app</title>
<style>
body {
margin: 0;
}
canvas {
100%;
height: 100%
}
</style>
</head>
<body>
<script src="../static/three.js-master/build/three.js"></script>
<script>
var renderer = new THREE.WebGLRenderer(); // 渲染器
renderer.setSize( window.innerWidth, window.innerHeight ); // 设置渲染器的宽度和高度
document.body.appendChild( renderer.domElement );
var camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 500 ); // 透视摄像机
camera.position.set( 0, 0, 100 ); // 设置坐标
camera.lookAt( 0, 0, 0 );
var scene = new THREE.Scene(); // 场景
// 上面是摄像机 下面是材料
//create a blue LineBasicMaterial
var material = new THREE.LineBasicMaterial( { color: 0x0000ff } ); // 定义线条的材料，接收字典类型的参数
var geometry = new THREE.Geometry(); // 声明一个几何体geometry
geometry.vertices.push(new THREE.Vector3( -10, 0, 0) );
geometry.vertices.push(new THREE.Vector3( 0, 10, 0) );
var line = new THREE.Line( geometry, material ); // 根据材料创建线条
scene.add( line ); // 将线条添加到场景内
renderer.render( scene, camera ); // 渲染器将场景和摄像机及线条渲染出来
</script>
</body>
</html>
附带three.js代码，点击下载