Adding 2D Text over a 3D scene: Coding a Heads Up Display (HUD) in 10 minutes
➤Code: https://editor.p5js.org/rjgilmour/ske...
The basic idea is to:
1) Use the camera's position and look-at point (eye and center) to calculate the pan and tilt angles.
2) Translate to the camera position 𝘁𝗿𝗮𝗻𝘀𝗹𝗮𝘁𝗲(𝗲𝘆𝗲𝗫, 𝗲𝘆𝗲𝗬, 𝗲𝘆𝗲𝗭)
3) Rotate our current coordinate frame by the pan and tilt angles so that the x-axis is pointing towards the look-at point 𝗿𝗼𝘁𝗮𝘁𝗲𝗬(𝗽𝗮𝗻); 𝗿𝗼𝘁𝗮𝘁𝗲𝗭(𝘁𝗶𝗹𝘁);
4) Translate along the x axis out in front of the camera 𝘁𝗿𝗮𝗻𝘀𝗹𝗮𝘁𝗲(𝟭𝟬𝟬, 𝟬, 𝟬)
5) Draw text, images and other HUD elements
➤Support the channel: https://ko-fi.com/morejpeg
➤Pan and Tilt: https://editor.p5js.org/rjgilmour/ske...
#gamedev #p5js #codingchallenges
Watch video Adding 2D Text over a 3D scene: Coding a Heads Up Display (HUD) in 10 minutes online without registration, duration hours minute second in high quality. This video was added by user morejpeg 08 February 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 544 once and liked it 17 people.