Converting world coordinates to screen coordinates

If you are creating a game that provides a 2D interface on top of a 3D world, for instance, as shown in the Creating a 2D overlay recipe, you might want to know how the 3D coordinates map to your 2D overlay. If you know the 2D coordinates, you can add all kinds of visual effects to the 2D overlay, such as tracking the code or letting the 2D overlay interact with the objects in the 3D scene.

Getting ready

You don't need to perform any steps to get ready for this recipe. In this recipe, we can use the THREE.Projector object available in Three.js to determine the correct coordinates. You can view the result from this recipe in action by opening 03.07-convert-world-coordintate-to-screen-coordinates.html ...

Get Three.js Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.