EffectHub.com: your best source for gaming

Recommendation

More Effects...

var scene = new THREE.Scene();
var aspect = window.innerWidth / window.innerHeight;
var camera = new THREE.PerspectiveCamera( 70, 1, 0.1, 1000 );
var windowCamera = new THREE.PerspectiveCamera( 70, aspect, 0.1, 1000 );

var d=0, t=0;
hemiLight = new THREE.HemisphereLight( 0xffff00, 0xffffff, .99 );
hemiLight.color.setRGB( 1,.5,.5 );
hemiLight.groundColor.setRGB( 1,.7,.5 );
hemiLight.position.set( 0, 1, 0 );

scene.add( hemiLight );
var renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

var geometry = new THREE.Geometry();

geometry.vertices.push(new THREE.Vector3( 0,  0, 0 ));

f=12
r=20

for(i=0; i<f; i++){
  z=Math.random()*1.2
  a=((2*Math.PI)/f)*i
  geometry.vertices.push(new THREE.Vector3( Math.sin(a)*r, Math.cos(a)*r, z ));
}

for(i=1; i<=f; i++){
geometry.faces.push( new THREE.Face3( 0, i, i-1) );
}
geometry.faces.push( new THREE.Face3( 0, 1, f ) );

geometry.dynamic = true;

var material = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0xffffff, shininess: 100, morphTargets: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } );
var mesh = new THREE.Mesh( geometry, material );
material.side = THREE.BackSide;
material.side = THREE.DoubleSide;
material.blending =THREE.AdditiveBlending;

material.transparent=true;
material.opacity=.1;

group = new THREE.Object3D();
group.add( mesh );

mesh.position.z=26

for(i=0; i<300; i++){
	var m=mesh.clone();
	m.rotation.z+=Math.random()*2*Math.PI
	m.material=material.clone();
	m.material.color.r=i/50;
	m.material.color.b=i/100;
	m.scale.x=m.scale.y=Math.cos(i/80)
	m.position.z-=i*.16
	m.scale.z=i/50*Math.sin(i)
	group.add(m);
}

scene.add(group);
windowCamera.position.z = 68;
windowCamera.near = 30;
windowCamera.far  = 95;
mesh.rotation.z += Math.PI;

group.rotation.x=Math.PI/4

console.log(group.children[0].rotation.x)
var render = function () {
	renderer.render( scene, windowCamera );
	requestAnimationFrame( render );
	t+=.5
	group.rotation.x=Math.PI/2//Math.PI/4+Math.sin(t/10)/2
	for(i=0; i<group.children.length; i++){
    group.children[i].scale.x=group.children[i].scale.y=Math.sin((i+t)/80)
		group.children[i].rotation.z+=group.children[i].scale.x/100
  }
	group.rotation.z=t/10;
	
};
render();

CSS

HTML

Recommendation

Join Effecthub.com