I am trying to visualize 3D data points by using three.js to read in data from a csv-file. I want to be able to click on specific points in the PointCloud to display other measurement data related to those points. I have tried implementing code that I found in examples, but I am having trouble getting it to work correctly.
function onDocumentMouseMove(e) {
mouseVector.x = 2 * (e.clientX / containerWidth) - 1;
mouseVector.y = 1 - 2 * (e.clientY / containerHeight);
var vector = new THREE.Vector3(mouseVector.x, mouseVector.y, 0.5).unproject(camera);
raycaster.ray.set(camera.position, vector.sub(camera.position).normalize());
scene.updateMatrixWorld();
intersects = raycaster.intersectObject(particles);
console.log(intersects);
}
However, the 'intersects' variable always returns an empty array regardless of which point I hover over.
Regarding the particles Object, here is my code:
geometry = new THREE.Geometry();
for (var i = 0; i < howmany; i++) {
var vector = new THREE.Vector3(data[i][0], data[i][2], data[i][1] );
geometry.vertices.push(vector);
}
attributes = {
size: { type: 'f', value: [] },
customColor: { type: 'c', value: [] }
};
uniforms = {
color: { type: "c", value: new THREE.Color( 0xFFFFFF ) },
texture: { type: "t", value: THREE.ImageUtils.loadTexture( "js/threejs/examples/textures/sprites/disc.png" ) }
};
var shaderMaterial = new THREE.ShaderMaterial( {
uniforms: uniforms,
attributes: attributes,
vertexShader: document.getElementById( 'vertexshader' ).textContent,
fragmentShader: document.getElementById( 'fragmentshader' ).textContent,
alphaTest: 0.9,
} );
particles = new THREE.PointCloud( geometry, shaderMaterial );
for (var i = 0; i < howmany; i++) {
colors[i] = new THREE.Color(RainBowColor(data[i][3], 4));
sizes[i] = PARTICLE_SIZE * 0.5;
}
scene.add(particles);
All variables are initialized beforehand, with PARTICLE_SIZE set to 20 and about 10,000 particles ranging between (0,0,0) and (10,000,10,000,10,000). I am using THREE.OrbitControls for rotation and zooming.
Can anyone spot the mistake or tell me if raycasting with particles is not possible in this case? Any help would be greatly appreciated.
Thank you, Mika.