0

I am not able to understand the execution of these lines in the code.

this.screenVector = new THREE.Vector3(0, 0, 0); this.screenVector.copy(this.position);
this.screenVector.project(camera); what does project(camera) means like what it does, and what screenVector means.

    function labelBox(Ncardinal, radius, domElement)
    {
    this.screenVector = new THREE.Vector3(0, 0, 0);
    this.position = convertlatlonToVec3(Ncardinal.lat,Ncardinal.lon).multiplyScalar(radius);
    this.box = document.createElement('div');
    a = document.createElement('a');
    a.innerHTML = Ncardinal.name;
    a.href ='http://www.google.de';
    this.box.className = "spritelabel";
    this.box.appendChild(a);

    this.domElement = domElement;
    this.domElement.appendChild(this.box);
    }

labelBox.prototype.update = function()
{
this.screenVector.copy(this.position);  
this.screenVector.project(camera);

var posx = Math.round((this.screenVector.x + 1)* this.domElement.offsetWidth/2);
var posy = Math.round((1 - this.screenVector.y)* this.domElement.offsetHeight/2);

var boundingRect = this.box.getBoundingClientRect();

//update the box overlays position
this.box.style.left = (posx - boundingRect.width) + 'px';
this.box.style.top = posy + 'px';

this.occludeLabel(this.box, this.marker);

};
lakers1234
  • 125
  • 1
  • 2
  • 14
  • Projects a vector to screen space. To do that you need to know the camera parameters. – gaitat Sep 26 '16 at 12:25
  • See http://stackoverflow.com/questions/27409074/three-js-converting-3d-position-to-2d-screen-position-r69 – WestLangley Sep 26 '16 at 12:26
  • The documentation for this is a https://threejs.org/docs/#Reference/Math/Vector3 it projects from the world coordinates to screen coordinates, modifying the vector its called on. – Salix alba Sep 26 '16 at 12:28

1 Answers1

1

Vector3.project( camera ) maps a 3D point from world space to normalized device coordinate (NDC) space. See http://www.songho.ca/opengl/gl_projectionmatrix.html.

The method is required as one step in converting a 3D point from world coordinates to screen coordinates (pixels). See https://stackoverflow.com/a/27412386/1461008.

three.js r.81

Community
  • 1
  • 1
WestLangley
  • 102,557
  • 10
  • 276
  • 276