Convert Screen to World coordinates


(Cboston) #1

I see in the API docs there is the ability to convert world coordinates to screen however is there a way to go in the opposite direction?

I am interested in building an interface to allow users to create there own annotations on the fly thru the regular viewer. Step 1 to this would be having the user click on a spot within the viewer to mark the position of the annotation. Of course at that point I would only have the screen coordinates and my final annotation to save will need the world coords.

Is there any way to do this thru the API or even without it thru some other means?


(Shaderbytes) #2

if is not so trivial as you have to define a axis aligned plane , could be one of three, to project the screen position onto to get a world coordinate. So a function in the API has to be created this function needs to get the mouse Position as well as the axis to understand the projection. Internally the mouse position has to be converted into a world raycast, the raycast then test hits against a plane created just for this purpose.

OF coarse existing geometry in the scene can also be used, I think the current click event on the API might have world coords provided in the click event…, This solution im explaining handles clicking in “blank areas” of the scene and still getting a world coord.

for example here is a function i use in Unity which explains this :

public Vector3 GetWorldPointFromMouse(Vector3 mousePosition, Vector3 axis) {
    Plane groundPlane = new Plane(axis,;
    Ray ray = HandleUtility.GUIPointToWorldRay(mousePosition);
    #pragma warning disable
    Vector3 hit = new Vector3();
     #pragma warning restore
    float dist;
    if (groundPlane.Raycast(ray, out dist))
        hit = ray.GetPoint(dist);
    return hit;


You could use the click event.

api.addEventListener( 'click', function (e) {
    // Do stuff


e.position3D is the coordinates of the click in 3D space
e.position2D is the coordinates of the click in the 2D canvas
e.normal is the vector of the normal at that point
e.instanceID is the clicked geometry node’s ID
e.material is the clicked material object


API - Create new annotations
(Cboston) #4

Thanks for the response!

I tried updating the Hello World example to just log out the click event and its not working for me. Missing something simple?

client.init(urlid, {
        success: function onSuccess(api) {
            api.addEventListener('viewerready', function () {

                // API is ready to use
                // Insert your code here


            api.addEventListener('click', function (e) {
        error: function onError() {
            console.log('Viewer error');


Sorry I forgot there is a required parameter pick in the latest version of the Viewer API. This should become optional in future versions. The event will also be properly documented.

api.addEventListener('click', function (e) {
{pick: 'slow'});

slow vs fast is a tradeoff between performance and the precision of coordinates, but it’s really only relevant for animated models.

(Shaderbytes) #6

Thanks @James i thought it does indeed exist in the click event, small typo, you wrote “position3D” twice :wink:


Fixed :wink:

(Cboston) #8

Thanks, that worked.

I do not see the “Click” event listed here:
Is that the right doc page?

Are there any other events besides the ones listed on that page for which I can register?


It’s missing from the documentation, but it will be added in the next update. There are currently no other events than those listed.