javascriptthree.jscontrolstrackball

Peculiar behavior of TrackballControls.target in Three.js


I am trying to create a simulation of 3D distribution of galaxies.

The galaxies are points.

question1.htm uses galaxydata1.txt to calculate and load the galaxy positions:

rawFile.open("GET", "galaxydata1.txt", false);

var parts = data[i].split("\t");

var D = parts[0];
var glon = parts[1]*3.1416/180;
var glat = parts[2]*3.1416/180;

var z = D*Math.sin(glat);
var xy = D*Math.cos(glat);
var x = xy*Math.cos(glon);
var y = xy*Math.sin(glon);

dotGeometry.vertices.push(new THREE.Vector3( x, y, z ));                

I want the simulation to work in resource-limited devices. So, I figured that I can calculate the positions beforehand and save them in a file.

I did this using write.htm to create galaxydata2.txt.

question2.htm uses galaxydata2.txt to load the galaxy positions:

var parts = data[i].split(" ");

rawFile.open("GET", "galaxydata2.txt", false);

dotGeometry.vertices.push(new THREE.Vector3( parts[0], parts[1], parts[2] ));

It can be verified that the transformation is accurate because both question1.htm and question2.htm generate exactly the same models.

Now, I have implemented a galaxy search function, which searches a galaxy by name and centers it using:

controls.target = dots.geometry.vertices[i];

You may try it by searching for m31 (one of the names for the Andromeda galaxy).

Bewilderingly, while the galaxy search function works in question1.htm, it doesn't work in question2.htm!

I have spent tens of hours since the last 2 days trying to find the cause, but cannot get head or tail of it.

Note that I have used exactly the same code to calculate the positions in both the cases.

Most probably, I am missing something which would be immediately clear to the experts here.

If / when possible, please guide me.


Solution

  • Your dots.geometry.vertices in your search function have not been converted into floats.. they are all strings.

    1: n {x: "-34.10470732858122", y: "95.77578953486031", z: "-66.52906941334713 "} 2: n {x: "-23.203470164906907", y: "64.44921156287786", z: "-43.97565350543055 "} 3: n {x: "-22.228259825915906", y: "57.0117730686664", z: "-31.448405312168955 "}

    So that will not work.

    You will need to do a .parseFloat on the data after you load it before stuffing it into the geometry.