THREE.js agrega dinámicamente puntos a una geometría de Puntos que no representa

Estoy usando Three.js r83.

Estoy tratando de agregar puntos dinámicamente a una geometría, pero la escena nunca se actualiza.

Esto funciona :

var tmaterial = new THREE.PointsMaterial({
    color: 0xff0000,
    size: 5,
    opacity: 1
});

var tgeometry = new THREE.Geometry();
var pointCloud = new THREE.Points(tgeometry, tmaterial);

for(var i = 0; i< 1000; i++) {
    x = (Math.random() * 200) - 100;
    y = (Math.random() * 200) - 100;
    z = (Math.random() * 200) - 100;
    tgeometry.vertices.push(new THREE.Vector3(x, y, z));
}
tgeometry.verticesNeedUpdate = true;
tgeometry.computeVertexNormals();

scene.add(pointCloud);

Esto no funciona:

var tmaterial = new THREE.PointsMaterial({
    color: 0xff0000,
    size: 5,
    opacity: 1
});

var tgeometry = new THREE.Geometry();
var pointCloud = new THREE.Points(tgeometry, tmaterial);
scene.add(pointCloud);

for(var i = 0; i< 1000; i++) {
    x = (Math.random() * 200) - 100;
    y = (Math.random() * 200) - 100;
    z = (Math.random() * 200) - 100;
    tgeometry.vertices.push(new THREE.Vector3(x, y, z));
}
tgeometry.verticesNeedUpdate = true;
tgeometry.elementsNeedUpdate = true;
tgeometry.computeVertexNormals();
renderer.render(scene, camera);

Como puede ver, la única diferencia es el hecho de que agregoscene.add(pointCloud); antes de agregar vértices.

¿Qué extraño?

Puedes encontrar unviolín Gracias a @hectate

Para ver lo que quiero decir, simplemente reemplace

init(); setPoints(); animate();

por

init(); animate(); setPoints();

Respuestas a la pregunta(2)

Su respuesta a la pregunta