Hello all.
I’m hoping to get help with projecting (casting?) a shape onto a plane where every 3D object in the scene is located. I thought about using shadows, but the objects are above and below the plane so casting shadows probably won’t be a viable option.
Luckily I ran into this example by prisoner849, which is almost exactly what I am looking for.
I did some very simple, minor edits here:
In this example the objects can still be picked, and the circular marker moves to each object.
What I am looking for is to always have the shader/markers showing on the plane where each sphere is at.
I attempted to get it to work here, but I’ve only been able to get the marker to show up in the center of the plane. Can anyone please take a look and help me with this?
Thanks.
I created a new codepen, based on my initial one:
3 Likes
Wow… Thank you so much! This looks almost exactly like what I want.
I really appreciate it!
Is there any way the green color could be variable depending on some value ?
I’m working on displaying different colors to a mesh from a data set and a legend. I can’t figure out an optimized way to do this.
Can the projections in the WebGLRenderTarget example be resized, or are they directly based on the sizes on the spheres?
Is there a way to set a THREE.Group as the uniforms marker, or does it have to be an array?
Sorry, I didn’t get what you mean.
More details? Explanatory pics?
Sorry about that.
What I mean is that I want to apply the 2D projection to something like this In this example the objects are in a group (in this case, testGroup). I was initially going to add a raycaster to this example, but decided not to so a group was the easiest way to go. I am wondering if the shader version of your code can be added to this example with the objects grouped together, as opposed to being in an array.
NEW Three.js animation test (codepen.io)
Thanks again for all your help with this.
What type the uniform has to be, if you want to pass THREE.Group into it? 
I’m not sure what you mean.
Prisoner, I have one more question regarding this topic. Is it possible to do this exact same thing with the plane being transparent or “invisible”? I’ve tried using a transparent .png image, but it eliminates everything from showing.
Thanks
I didn’t get. How does the desired result have to look like?
What I’m asking is can this same effect be done with the markers showing where all of the spheres are, but without the plane showing?
Basically, it would look like the markers are “floating in space” in the same positions but the plane would not show.
