Vizu
by g
HTML
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<div id="container"></div>
JavaScript
(function() {
var lastTime = 0;
var vendors = ['webkit', 'moz'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame =
window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
timeToCall);
lastTime = currTime + timeToCall;
return id;
};
if (!window.cancelAnimationFrame)
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}());
var eqData = function() {
return {
left: Array.apply(null, new Array(256)).map(function(){ return Math.random(); }),
right: Array.apply(null, new Array(256)).map(function(){ return Math.random(); })
};
};
var WIDTH = 400,
HEIGHT = 300;
var VIEW_ANGLE = 45,
ASPECT = WIDTH / HEIGHT,
NEAR = 0.1,
FAR = 10000;
var $container = $('#container');
var renderer = new THREE.WebGLRenderer();
var camera =
new THREE.PerspectiveCamera(
VIEW_ANGLE,
ASPECT,
NEAR,
FAR);
var scene = new THREE.Scene();
// add the camera to the scene
scene.add(camera);
// the camera starts at 0,0,0
// so pull it back
camera.position.z = 300;
// start the renderer
renderer.setSize(WIDTH, HEIGHT);
// attach the render-supplied DOM element
$container.append(renderer.domElement);
var sphereMaterial =
new THREE.MeshLambertMaterial(
{
color: 0xCC0000
});
var radius = 50,
segments = 16,
rings = 16;
var sphere = new THREE.Mesh(
new THREE.SphereGeometry(
radius,
segments,
rings),
...