Allow dust follow rcCar

i added shader

const dust = new THREE.Points(geometry, material);
scene.add(dust);

it updates in gameloop

  const positionAttribute = dustGeometry.getAttribute("position");

  for (let i = 0; i < count; i++) {
    const i3 = i * 3;

    ...
    if (positionAttribute.array[i3 + 1] > 2.5) {
      positionAttribute.array[i3] = (Math.random() - 0.5) * 8;

      positionAttribute.array[i3 + 1] = -2.5;
      positionAttribute.array[i3 + 2] = (Math.random() - 0.5) * 4;
    }

and there i use these lines to allow dust follow rcCar

let throughDiffDustAndRCCar = new THREE.Vector3().subVectors(new THREE.Vector3(dust.position.x,0, dust.position.z), new THREE.Vector3(samplePickRCCar.position.x,0, samplePickRCCar.position.z) )

 dust.position.copy({x: samplePickRCCar.position.x, y: camera.position.y, z: samplePickRCCar.position.z + throughDiffDustAndRCCar.z     })

the issue is that samplePickRCCar.position.z and dust.position.z are expected to be different to allow dust be shown in camera

what diff of vectors i may use?

dust expected to be in the end of the car, it depends of camera.y
and there diff between rcCar.position.z and dust.position.z to be shown in camera

@PavelBoytchev @Lawrence3DPK

Excuse for pointing
Still didnt find a solution for that

Thanks

i found this one, particle works, camera position is not handled
https://github.com/BilguunTs/Space-Dust-with-threejs/tree/main

do you need to do this for a reason? alternatively you could use

RCCar.add(dust) 

so the dust object is attached to the car and use an offset so it sits at the back of the car…

@Lawrence3DPK
dust became mappd to camera, it became visible only when has same y that camera has

i did

RCCar.add(dust) 

and dust became not visible, RCCar on scene

that is how i did working dust with position copy

dust.position.copy({x: samplePickRCCar.position.x, y: camera.position.y, z: samplePickRCCar.position.z + throughDiffDustAndRCCar.z     })
position copy


it is walkin through x when car is moving through z

There i attached royal palm into car using position copy

and dust attached to viewport and camera
may be pick another vfx dust

palm position copy

You probably don’t want to compute the offset from the current dust position every frame. That makes the dust “chase itself” and can give unstable or confusing results.

Instead, keep a fixed offset behind the car, based on the car direction or camera direction. For example, if the car only moves along Z:

const dustOffset = new THREE.Vector3(0, 0, -2); // behind car, adjust value

dust.position.set(
  samplePickRCCar.position.x,
  camera.position.y,
  samplePickRCCar.position.z + dustOffset.z
);

If the car can rotate, use its world direction:

const dir = new THREE.Vector3();
samplePickRCCar.getWorldDirection(dir);

const dustOffset = dir.multiplyScalar(-2); // behind car

dust.position.copy(samplePickRCCar.position).add(dustOffset);
dust.position.y = camera.position.y;

Then update the particle positions inside the dust local space as you already do. The important part is: the particles should move relative to the dust object, and the dust object should be placed behind the car with a stable offset.

the issue
dust mapped to a camera

the car mapped to the projection

expected
dust mapped to the projection

if car mapped to projection…

dust mapped to car automatically map dust to projection…

I don’t see the need for the dust copying camera y at all? the dust will also inherit the world direction of the car.

when webgl has complete language for shaders
renderer uses camera, camera works with dust when y matched

I don’t know if this helps or not.

I created a smoke trail for my airplane that consisted of a fixed number of smoke sprites. Every frame or two, I would leave one at the current position of the airplane. The sprite would remain in that location, slowly fading out until I again placed the sprite at the current position of the airplane.

Of course, you have to compute the sprite distance by subtracting the camera map position from the the sprite map position.

For a car on a dirt road, you could do the same thing, but with fewer sprites. In addition to fading, the sprite could grow in size with each frame.

While this approach does not use a shader or linked objects, my understanding is that sprites that share the same texture are processed together in the GPU.

I tried to do instancing of position of the dust shader with same values that latest shader had

shader position has new values instead

i may extend your idea and add a stub of shader that has same interface that tsl operations provide

and implement it through js
to achive positioning

primitives and blend \ the things that i dont have