I’m rendering a point cloud using Points and and PointMaterial. I set the positions as follows
const geometry = this.geometry = new THREE.BufferGeometry();
this.vertices = [];
this.rotations = [];
for ( var i = 0; i < this.data.count; i ++ ) {
const x = this.data.positions[i][0] * this.data.scale;
const y = this.data.positions[i][1] * this.data.scale;
const z = this.data.positions[i][2] * this.data.scale;
this.vertices.push( x, y, z );
}
geometry.setAttribute( 'position', new THREE.Float32BufferAttribute( this.vertices, 3 ) );
Is it possible to also set the rotation of the individual points in the same way, i.e. something like:
geometry.setAttribute( 'rotation', new THREE.Float32BufferAttribute( this.rotations, 3 ))
I tried setting the rotations this way, but it doesn’t work. I’m wondering if this is not possible, or if I’m just messing something up.
Hi!
How should rotation of individual point act? Do you want to create kind of a snow whirlwind?
I’m using the texture loader to load a PNG of an Arrow for every point. I just need those arrows to be pointing in a certain direction. The rotation won’t change after being set intitially
Look at points as at small planes, that always look at camera. I didn’t get why you use 3D coordinates for them.
I’m not sure, but seems you want to achieve somethingn like this: Benares (shaders) (see the jsfiddle with “charges”).
I took a look at your fiddle but I’m not sure its what I’m trying to achieve.
All the arrows are pointing in the same direction. I’d like to rotate them so that they point in different directions.
AFAIK, there is no built-in functionality for rotation of texture on individual points, thus you just need to modify THREE.PointsMaterial: https://jsfiddle.net/prisoner849/1wpo8t92/
4 Likes
Ah that looks really promising! Thank you for the help!
Do you know how I would update the shader to use an x, y, and z rotation?
Nope.
I would try to use instancing (mesh or geometry) to be able to orient instances of a simple geometry (a cone, for example) in three dimensions.
Thats a good idea. I was using instancing originally, but unfortunately, its not as performant as Points. I’ll start a new thread to see if its possible to rotate points using a shader in three dimnesions
How many points do you plan to have?
Just wrote a simple example with InstancedMesh (10000 instances): https://jsfiddle.net/prisoner849/1c8zrvhp/
It ranges, but up to the 100s of thousands. Maybe I’ll test it out again to see if it works ok.
