Я визуализирую 3D-точки данных (которые я читаю через CSV-файл) с помощью three.js. Я хочу щелкнуть точки в этом PointCloud, чтобы отобразить другие данные измерений для этих конкретных точек. Судя по примерам, я обнаружил, что это возможно, но у меня это не работает. У меня есть следующий код (в основном из этих примеров):
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);
}
Но пересечения всегда являются пустым массивом, независимо от того, какую точку я перемещаю.
По поводу частиц Object я написал следующее:
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);
где все переменные инициализированы ранее, PARTICLE_SIZE равно 20, а число частиц составляет около 10 000 со значениями от (0,0,0) до (10000,10000,10000). Для вращения и масштабирования я использую THREE.OrbitControls.
Кто-нибудь видит ошибку или рейкастинг с частицами в данном случае невозможен?
Большое спасибо, Мика.
THREE.Raycaster.params.PointCloud.threshold
по умолчанию равно 1. Попробуйте увеличить его. Пройдитесь с отладчиком по небольшой проблеме с 2 частицами. - person WestLangley   schedule 09.01.2015raycaster.params.PointCloud.threshold = 20;
и... сработало. В любом случае мне придется поработать над тонкой настройкой размеров точек. Итак, во-первых, мне очень помогает то, что я знаю важность этого порога. Спасибо. - person Mika Prouk   schedule 09.01.2015