Преобразование координат мира в координаты экрана в Three.js с использованием проекции

Есть несколько отличных стековых вопросов(1 , 2)о непроецировании в Three.js, то есть о том, как преобразовать (x,y )координаты мыши в браузере в (x,y,z )координаты в пространстве холста Three.js. В основном они следуют этой схеме:

    var elem = renderer.domElement, 
        boundingRect = elem.getBoundingClientRect(),
        x = (event.clientX - boundingRect.left) * (elem.width / boundingRect.width),
        y = (event.clientY - boundingRect.top) * (elem.height / boundingRect.height);

    var vector = new THREE.Vector3( 
        ( x / WIDTH ) * 2 - 1, 
        - ( y / HEIGHT ) * 2 + 1, 
        0.5 
    );

    projector.unprojectVector( vector, camera );
    var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );
    var intersects = ray.intersectObjects( scene.children );

Я пытался сделать обратное -вместо перехода из пространства «экран в мир», чтобы перейти из пространства «мир в экран». Если я знаю положение объекта в Three.js, как мне определить его положение на экране?

Кажется, нет опубликованного решения этой проблемы. Другой вопрос по этому поводу только что появился на стеке , но автор утверждает, что решил проблему с функцией, которая у меня не работает. В их решении не используется спроецированный луч, и я почти уверен, что, поскольку преобразование 2D в 3D использует unprojectVector (), для решения преобразования 3D в 2D потребуется projectVector ().

Также эта проблема открыта на Github.

Любая помощь приветствуется.

31
задан Community 23 May 2017 в 11:33
поделиться