Three.js Custom Shader Object Coordinate

Seems I’ve fixed it, watching the video from Martijn.
You’ve done most of work with porting, and this is really great :+1:

Camera position needs to be converted to cube’s local space:

  v.copy(camera.position);
  cube.worldToLocal(v);
  material.uniforms.camPos.value.copy(v);

In shaders, " vPosition = position;", - cube’s vertex position is in local space (no multiplications with matrices needed)

Thus, ray origin and ray direction set like this:

  "	vec3 ro = camPos; //vec3(0, 1, 0);",
  "	vec3 rd = normalize(vPosition - ro); //normalize(vec3(uv.x, uv.y, 1));",

And finally, shift the raymarching scene, that the sphere is in the center of it:

  "    float objectDist = sphereSDF(p, 0.25);",
  "    float groundDist = p.y + 0.25;",

Ah, and camera position is like that :camera.position.set(2, 1, 0);

Picture:

изображение

Example: https://codepen.io/prisoner849/full/YzpBPbm

5 Likes