Shift My Data or Set Position of Camera?

Hello THREE JS’ers:

I am a noob to ThreeJS and I have a question regarding best practices for handling my data in a 3D view. My data are a bunch of oil well trajectories in the subsurface of the earth. Essentially a bunch of 3D lines.

The tricky part is that the X and Y locations are offsets from a State Plane origin and the vertical numbers (‘z’) are just depths below the initial surface location. A snippet of a 3D well path is shown below. All dimensions are in feet and the differences between all 3D dimensions is the same, again in feet. The first two columns are just offset from a datum.

Northing(ft) Easting(ft) Depth(ft)
973928.9 795644.8 0
973927.6 795634.8 643.89
973927.6 795634.6 650.89
973927.6 795633.7 681.88
973926.5 795633.1 713.45
973924 795633 744.44
973920.2 795633.3 775.91
… … …

My question(s) are as follows. Is it best for me to:

  1. translate all of my data into a 0,0,0 origin or
  2. Can I just leave the data as is and just set the camera to the averages, or something better, of the data?

I want to use that nice grid Threejs offers using the helper:

var grid = new THREE.GridHelper(50, 50, 0xffffff, 0x555555);

But this centers itself at 0,0,0. I could supposedly shift this to the average of the data if I choose option #2 above.

Any help or guidance you can offer would be invaluable.



Are you aware that the grid helper is actually flat? So it lies in the xz plane and all vertices have a y component of 0. AFAICS, the depth values of your data are different. Isn’t that a problem? I mean it seems that your plane isn’t flat, right?

You don’t have to shift every point in your data, anyway. You could shift the containing object. If the lines are now added directly to the scene, just move them into a THREE.Group that you can add to the scene instead. The position of the group shifts everything.

Thanks Michael. Yes, I understand that the grid is 2D with y=0 for xz . That is what I want to show, a plane of Sea Level (‘MSL’) along with my data. It is standard in the oil and gas industry to show a sea-level grid to allow users to quickly reference how their data is positioned relative to MSL.

In my data that I show, it is actually the last column that ends up being ‘y’.

Thanks Elias. I will try this for sure.

My question still stands: is it better to do what you propose or to keep my data in its own coordinate system and then just make the camera work in the data’s coordinate system. I am trying the latter first, but really not getting what I want. I am trying to understand how much of threejs is built around having your data centered around ‘xz’ being centered around zero (‘0’).

As I said, I am a noob here and learning a lot. Thanks again.

There is in principle nothing wrong with moving or attaching the camera. Three.js handles that quite well, except some (historical?) problems with using camera.lookAt when the camera has transformed parents/ancestors. Some tools may be tailored for zero-centering, just as some tools/shaders are tailored for y-up. But you need to be more specific on what you are not getting that you want.

1 Like