EffectHub.com: your best source for gaming

Recommendation

More Effects...

var renderer, scene, camera, field;

var ww = window.innerWidth,
  wh = window.innerHeight;

function init() {

renderer = new THREE.WebGLRenderer({
    canvas: document.querySelector('canvas'),
    antialias: true
  });
  renderer.setSize(ww, wh);
  renderer.setClearColor(0x000000);

scene = new THREE.Scene();

camera = new THREE.PerspectiveCamera(50, ww / wh, 0.1, 10000);
  camera.position.set(0, 200, 0);
  camera.lookAt(new THREE.Vector3(0, 0, 0));
  scene.add(camera);

controls = new THREE.OrbitControls(camera);

createField();
}

var size = 200;

function createField() {

requestAnimationFrame(render);
}

noise.seed(Math.random());
function render(a) {
  requestAnimationFrame(render);
  
  for(var i=field.geometry.vertices.length-1;i>=0;i--){
    var vector = field.geometry.vertices[i];
    var value = noise.simplex3(vector.origin.x/40, vector.origin.z/40, a/4000);
    vector.x = vector.origin.x + (2 * value);
    vector.z = vector.origin.z + (2 * value);
  }
  
  field.geometry.verticesNeedUpdate = true;

renderer.render(scene, camera);
}
init();

CSS

HTML

Recommendation

Join Effecthub.com