mrdoob/three.js — Issue #1079: Particle Rendering, Massive Data Set
Author: landonsilla
Created: 2012-01-12 01:14:18+00:00
State: open

I am trying to develop a point cloud viewer capable of showing millions of points. WebGL and Three.js have proven to be AWESOME and very powerful. I understand this is very very new and the documentation just hasn't been developed yet, so I'm trying this for some help. Here's what I've got so far:

http://archive.cyark.org/3d/index7.php?chunks=5

(Adjust the chunks param from 1-75 depending on how many points you want to display, a "chunk" is 100,000 points)

These are the pyramids at Tikal. The points load well, they are colored correctly and in the correct place. But the clarity is just terrible! I'm somewhat new to the whole 3d thing, so hopefully I'm just missing something pretty obvious.

I don't know what is really important to show here code-wise (you can just view source on the link above for all of it). Here's the material:

colorShaderMaterial = new THREE.ShaderMaterial( {
uniforms:	uniforms,
attributes:	colorAttributes,
vertexShader: document.getElementById( 'vertexshader' ).textContent,
fragmentShader: document.getElementById( 'fragmentshader' ).textContent,
transparent:	true

});

Then I go on to make a geometry and attributes (for the color and a size of 1). I then slap the two in a ParticleSystem and then in the scene.

I took this screenshot (http://archive.cyark.org/temp/pointcloud.jpg). This is taken from a desktop application of the same data (kick up the chunks above to 75 to make sure you're getting a good point density). The difference between my app and this image is night and day. My app looks like static on a tv.

Mr. Doob, do you have any thoughts on this? What am I doing wrong here?