forked: Three.js particles

Readme
JavaScript 88 lines
HTML 11 lines
CSS 11 lines

forked: Three.js particles

// forked from djankey's "Three.js particles " http://jsdo.it/djankey/t8j5
// GLOBALS
var container, scene, camera, renderer, stats, controls, particles, particleSystem, particleCount = 5000;

particleSystem = new THREE.ParticleSystem(particles, pMaterial);
    particleSystem.sortParticles = true;
    scene.add(particleSystem);    
    
    // STATS
    stats = new Stats();
	stats.domElement.style.position = 'absolute';	
    stats.domElement.style.top = '0px';                //stats.domElement.style.bottom = '0px';
	stats.domElement.style.zIndex = 100;
	container.appendChild(stats.domElement);    
    
    // CONTROLS
    controls = new THREE.TrackballControls(camera, renderer.domElement );    
    
    // RESIZE
    window.addEventListener('resize', resizeHandler, false);
    resizeHandler();
    
    // ANIMATE
    animate();
}

function resizeHandler() {    
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();

renderer.setSize( window.innerWidth, window.innerHeight );  
}

function animate() {
    requestAnimationFrame(animate);    
    controls.update();
    stats.update();
    particleSystem.rotation.y += 0.003; 
    
	renderer.render( scene, camera );    
}

// Init
window.addEventListener('load', init, false);

forked: Three.js particles

// forked from djankey's "Three.js particles " http://jsdo.it/djankey/t8j5 // GLOBALS var container, scene, camera, renderer, stats, controls, particles, particleSystem, particleCount = 5000; function init() { // SCENE scene = new THREE.Scene(); scene.fog = new THREE.FogExp2( 0x000000, 0.00005 ); // CAMERA camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 3000); camera.position.set( 0, 300, 1000); scene.add(camera); // RENDERER if ( Detector.webgl) { renderer = new THREE.WebGLRenderer( {antialias:true} ); } else { renderer = new THREE.CanvasRenderer(); } // CONTAINER container = document.createElement('div'); document.body.appendChild(container); container.appendChild(renderer.domElement); // PARTICLES particles = new THREE.Geometry(); var pMaterial = new THREE.ParticleBasicMaterial({color: 0xFFFFFF, size: 25, map: THREE.ImageUtils.loadTexture('http://jsrun.it/assets/8/u/p/6/8up6b.jpg'), blending: THREE.AdditiveBlending, transparent: true}); var delta = 20; for(var p = 0; p < particleCount; p++) { var pX = Math.random() * 400 - 200, pY = Math.random() * 400 - 200, pZ = Math.random() * 400 - 200; if(pX<delta && pX>0) pX +=delta; else if(pX>-delta && pX<=0) pX -=delta; if(pY<delta && pY>0) pY +=delta; else if(pY>-delta && pY<=0) pY -=delta; if(pZ<delta && pZ>0) pZ +=delta; else if(pZ>-delta && pZ<=0) pZ -=delta; var particle = new THREE.Vector3(pX, pY, pZ); particles.vertices.push(particle); } particleSystem = new THREE.ParticleSystem(particles, pMaterial); particleSystem.sortParticles = true; scene.add(particleSystem); // STATS stats = new Stats(); stats.domElement.style.position = 'absolute'; stats.domElement.style.top = '0px'; //stats.domElement.style.bottom = '0px'; stats.domElement.style.zIndex = 100; container.appendChild(stats.domElement); // CONTROLS controls = new THREE.TrackballControls(camera, renderer.domElement ); // RESIZE window.addEventListener('resize', resizeHandler, false); resizeHandler(); // ANIMATE animate(); } function resizeHandler() { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize( window.innerWidth, window.innerHeight ); } function animate() { requestAnimationFrame(animate); controls.update(); stats.update(); particleSystem.rotation.y += 0.003; renderer.render( scene, camera ); } // Init window.addEventListener('load', init, false); <script type="text/javascript" src="http://jsrun.it/assets/1/u/8/z/1u8zg"></script>  <script type="text/javascript" src="http://jsrun.it/assets/w/3/o/t/w3ot6"></script>  <script type="text/javascript" src="http://jsrun.it/assets/x/c/X/T/xcXTR"></script>  <script type="text/javascript" src="http://jsrun.it/assets/j/T/n/u/jTnux"></script>body { font-family: Monospace; background-color: #000000; overflow: hidden; } * { margin: 0; padding: 0; border: 0; }

	Smartphone Controllerjsdo.it WebSocket Controller»
	Mouse
	Keyboard
	Touch Device

forked: Three.js particles

Description What kind of game?

Control Device

Fullscreen

Author

Default Panel

Size

code

Discussion

Tags