We are about to switch to a new forum software. Until then we have removed the registration on this forum.
I'm trying to map html text on top of a webgl p5.js sphere of nodes that is rotating. I know I have to do something with a projection matrix and a view matrix in order to convert from 3d space to 2d but not sure how to get the matrix of the camera, if that's what I'm supposed to do? I found this which looked promising http://webglfactory.blogspot.co.uk/2011/05/how-to-convert-world-to-screen.html
You can see an Instagram vid example here: http://brendandawes.com/blog/07-31-471
Any help would be great. Incidentally I did something similar when using Three.js but I could get the projection matrix, with he p5.js one I'm not sure how I get that.
Answers
So I've got a bit further. I realised that I needed to 3D rotate the vectors but p5.js doesn't support 3d rotation of vectors. So I found this function online which seemed to do the job.
Then I found this online too which goes some way too mapping the 3d coords to the screen
Certainly getting there if you have a look at this http://www.brendandawes.com/blog/08-01-473 but still not right.
screenX, screenY?
P5.js doesn't have screenX or screenY unfortunately.
@brendandawes, you can make requests here: https://GitHub.com/processing/p5.js/issues
Tell them about screenX(), screenY() & screenZ() from these links:
https://Processing.org/reference/screenX_.html
http://ProcessingJS.org/reference/screenX_/
There are also modelX(), modelY() & modelZ():
https://Processing.org/reference/modelX_.html
http://ProcessingJS.org/reference/modelX_/
https://GitHub.com/processing/p5.js/issues/1553