Skip to content

Commit 3433b49

Browse files
committed
Beautified usage example.
1 parent 77d7a99 commit 3433b49

File tree

1 file changed

+33
-30
lines changed

1 file changed

+33
-30
lines changed

README.md

Lines changed: 33 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -82,57 +82,60 @@ More? [#three.js on irc.freenode.net](http://webchat.freenode.net/?channels=thre
8282

8383
Download the [minified library](http://mrdoob.github.com/three.js/build/Three.js) and include it in your html.
8484

85-
<script src="js/Three.js"></script>
85+
```html
86+
<script src="js/Three.js"></script>
87+
```
8688

8789
This code creates a camera, then creates a scene, adds a cube on it, creates a &lt;canvas&gt; renderer and adds its viewport in the document.body element.
8890

89-
<script>
91+
```html
92+
<script>
9093
91-
var camera, scene, renderer,
92-
geometry, material, mesh;
94+
var camera, scene, renderer,
95+
geometry, material, mesh;
9396
94-
init();
95-
animate();
97+
init();
98+
animate();
9699
97-
function init() {
100+
function init() {
98101
99-
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
100-
camera.position.z = 1000;
102+
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
103+
camera.position.z = 1000;
101104
102-
scene = new THREE.Scene();
105+
scene = new THREE.Scene();
103106
104-
geometry = new THREE.CubeGeometry( 200, 200, 200 );
105-
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
107+
geometry = new THREE.CubeGeometry( 200, 200, 200 );
108+
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
106109
107-
mesh = new THREE.Mesh( geometry, material );
108-
scene.add( mesh );
110+
mesh = new THREE.Mesh( geometry, material );
111+
scene.add( mesh );
109112
110-
renderer = new THREE.CanvasRenderer();
111-
renderer.setSize( window.innerWidth, window.innerHeight );
113+
renderer = new THREE.CanvasRenderer();
114+
renderer.setSize( window.innerWidth, window.innerHeight );
112115
113-
document.body.appendChild( renderer.domElement );
116+
document.body.appendChild( renderer.domElement );
114117
115-
}
118+
}
116119
117-
function animate() {
120+
function animate() {
118121
119-
// Include examples/js/RequestAnimationFrame.js for cross-browser compatibility.
120-
requestAnimationFrame( animate );
121-
render();
122+
// Include examples/js/RequestAnimationFrame.js for cross-browser compatibility.
123+
requestAnimationFrame( animate );
124+
render();
122125
123-
}
126+
}
124127
125-
function render() {
128+
function render() {
126129
127-
mesh.rotation.x += 0.01;
128-
mesh.rotation.y += 0.02;
130+
mesh.rotation.x += 0.01;
131+
mesh.rotation.y += 0.02;
129132
130-
renderer.render( scene, camera );
133+
renderer.render( scene, camera );
131134
132-
}
133-
134-
</script>
135+
}
135136
137+
</script>
138+
```
136139

137140
### Change Log ###
138141

0 commit comments

Comments
 (0)