+
1
|
list
|
skin
|
login
|
editor
α-wwwiki
::
cube
user:none
(1707 bytes)
_h1 cube rotate _p For security reasons, calling an external Javascript is not authorized in alphawiki. Here is shown how can be used the [[three.js|http://threejs.org/]] library (uploaded in the data folder). {input {@ type="submit" value="include three.js" onclick="°° var js = document.createElement('script'); js.type ='text/javascript'; js.src = 'data/threejs/three.min.js'; document.body.appendChild( js ); this.value = 'OK, three.js is included !'; this.disabled='disabled'; °°"}} wait a little bit and {input {@ type="submit" value='start cube rotate' onclick="°° var camera, scene, renderer, mesh; var init = function () { renderer = new THREE.CanvasRenderer(); renderer.setSize( 400, 400 ); getId('output').appendChild( renderer.domElement ); camera = new THREE.PerspectiveCamera( 75, 400 / 400, 1, 1000 ); camera.position.z = 150; scene = new THREE.Scene(); var geometry = new THREE.CubeGeometry( 100, 100, 10 ); var material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true, wireframeLinewidth: 1 } ); mesh = new THREE.Mesh( geometry, material ); scene.add( mesh ); }; var animate = function () { requestAnimationFrame( animate ); mesh.rotation.x = Date.now() * 0.0005; mesh.rotation.y = Date.now() * 0.001; renderer.render( scene, camera ); }; init(); animate(); °°"}} {div {@ id="output" style="border:1px solid;"}} _h3 links _ul [[threejs.org|http://threejs.org/]] _ul [[fhtr.org/BasicsOfThreeJS|http://fhtr.org/BasicsOfThreeJS/]] _ul [[www.realtimerendering.com/blog/tag/three-js|http://www.realtimerendering.com/blog/tag/three-js/]]