Why is this simple THREE.js javascript particle system not working?

Question

Are there any errors is this code? I am using a new version of Chrome to test on. I've written a similar program that displays a wireframe cube, with no issues. It ran well. I'm thinking I may have written or structured my code incorrectly.

var scene = new THREE.Scene(); 
var camera = new THREE.PerspectiveCamera(50,window.innerWidth/window.innerHeight, 1, 10000); 
var renderer = new THREE.WebGLRenderer(); 
  renderer.setSize(window.innerWidth, window.innerHeight); 
  document.body.appendChild(renderer.domElement); 

// create the particle variables
var particleCount = 1000;
var particles = new THREE.Geometry();
var pMaterial = new THREE.ParticleBasicMaterial({
  color: 'red',
  size: 20
});

// create the individual particles
for (var p = 0; p < particleCount; p++) {
  var pX = Math.random()*500 - 250;
  var pY = Math.random()*500 - 250;
  var pZ = Math.random()*500 - 250;
  var particle = new THREE.Vertex(
    new THREE.Vector3(pX, pY, pZ)
  );
  particles.vertices.push(particle);
}

// create the particle system
var particleSystem = new THREE.ParticleSystem(
  particles,
  pMaterial);

// add the particle system to the scene
scene.add(particleSystem);

function render() {
  particleSystem.rotation.y += 0.01;
  renderer.render(scene, camera);
  requestAnimationFrame(render);
}
render();

I'm not seeing any results, so to speak - just a black canvas element on the page.

Answer 1

Your code looks outdated -- as if you copied something from the net, or from an outdated book.

Update to the current version of three.js, and learn from the current three.js examples.

Create your particles like so:

var particle = new THREE.Vector3( pX, pY, pZ );

Also, ParticleSystem is now PointCloud , and ParticleBasicMaterial is now PointCloudMaterial .

three.js r.69