2D image follows 3D object

Hello guys, i have my 2d image following 3d object on screen, ,however i need that image to stay on the screen even when i cant see the 3d object ingame, its kinda navigating player to turn around until he can see the object, but now i cant see the red marker when i turn around, and i need to keep it on the screen, any hints? :smile: thank you

Here is image so you can exactly know what i mean,… we can see red marker which follows 3d object position, but when you turn around you no longer see marker, and i need it to stay on screen. I need to stop it somehow when its trying to get beyond screen size

Hi @smokys! How are you? Nice question! I decided to create something like this for a 3D game after another 2D game forum question. Unfortunately, I didn’t finish it because of some problems that I was unable to solve at that moment.

2 Likes

What you can do is check the global position of the UI element. Using the X/Y values:

0, 0 is the middle of the screen

-1, -1 is the bottom left of the screen

1, 1 is the top right of the screen.

If you clamp them between -1 and 1, it will always be on screen.

1 Like

Thats what i was thinking to do but was not sure how to use those co-rds, and i thought its Math floor so i was completely wrong, but not sure how to use clamp… maybe something like setLocalPosition(Math.clamp(-1, 1), Math.clamp(-1, 1), 0) ??

Use the world position (setPosition and getPosition)

And here is a code for better explanation, however the last IF statement is for testing and will be deleted, is not related to code above

Quick example: https://playcanvas.com/editor/scene/1311715

1 Like

Thank you, there is something wrong with my code then because it works only for one half of the screen, the right side :o

Its weird cuz i copy-pasted your code…

I also use image instead of Sprite, but it should not make any difference, hm?

Does this also work when you rotate the camera? Because this was my problem.

Should do

Well I also rotate the camera, maybe thats why its not working completely, try Albertos and let me know if that works for you, i im good anyway :smile: hope you too

I see bottom and right side is working nice bot top-left is not

I’m not on my desktop at the moment. Does it work correct if you leave the camera at the original rotation?

Nope. I made a little progress, i tried to change anchor and pivot of the image and its now not going off the screen but the positioning is bad. i will try to play around little more with that

Not it is quite good but this is weird, not sure if it soupposed to be like that but now im right behind it but marker is top and should but down as the object is behind us

That sounds like the same problem as my problem.

Well now i dont even have that issue , now its the same, i tried every single preset but only Bottom left anchor i closest to right solution, but its not working though… top-left not is still off screen ( i mean the whole top and left side )

image

I had to change these numbers to get it right

But still, when the object is behind me it shows marker top instead of bottom, and that really confuses as you think you are supposed to go forward…

I still didnt figured out how to detect whether object is behind me, @yaustar could you please try it in your project u mentioned above? like put the object with UI far more behind the camera to see if its also your problem…

Becausse when you are close to the object and its behind camera then there is no problem, but the issue comes out when the marker is way more behind camera

you can use dot product of two 3d vectors … one of them being the camera.forward direction, and the other being normalized camera position - object position. If the result is less than 0, those vector are facing away from either other and that means the object is behind the camera.

1 Like