diff --git a/docs/manual/introduction/Drawing-lines.html b/docs/manual/introduction/Drawing-lines.html index 04570297b36bed83d0226557c7594b53974678bd..de255931c2fde04e89f2219bf8e6e33c90d38ce6 100644 --- a/docs/manual/introduction/Drawing-lines.html +++ b/docs/manual/introduction/Drawing-lines.html @@ -18,19 +18,19 @@

Here is the code that we will use:

var renderer = new THREE.WebGLRenderer(); -renderer.setSize(window.innerWidth, window.innerHeight); -document.body.appendChild(renderer.domElement); +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(new THREE.Vector3(0, 0, 0)); +var camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 500 ); +camera.position.set( 0, 0, 100 ); +camera.lookAt( new THREE.Vector3( 0, 0, 0 ) ); var scene = new THREE.Scene();

Next thing we will do is define a material. For lines we have to use [page:LineBasicMaterial] or [page:LineDashedMaterial].

//create a blue LineBasicMaterial -var material = new THREE.LineBasicMaterial({ color: 0x0000ff }); +var material = new THREE.LineBasicMaterial( { color: 0x0000ff } );

@@ -40,22 +40,22 @@ var material = new THREE.LineBasicMaterial({ color: 0x0000ff }); var geometry = new THREE.Geometry(); -geometry.vertices.push(new THREE.Vector3(-10, 0, 0)); -geometry.vertices.push(new THREE.Vector3(0, 10, 0)); -geometry.vertices.push(new THREE.Vector3(10, 0, 0)); +geometry.vertices.push(new THREE.Vector3( -10, 0, 0) ); +geometry.vertices.push(new THREE.Vector3( 0, 10, 0) ); +geometry.vertices.push(new THREE.Vector3( 10, 0, 0) );

Note that lines are drawn between each consecutive pair of vertices, but not between the first and last (the line is not closed.)

Now that we have points for two lines and a material, we can put them together to form a line.

-var line = new THREE.Line(geometry, material); +var line = new THREE.Line( geometry, material );

All that's left is to add it to the scene and call [page:WebGLRenderer.render render].

-scene.add(line); -renderer.render(scene, camera); +scene.add( line ); +renderer.render( scene, camera );

You should now be seeing an arrow pointing upwards, made from two blue lines.