explain the custom layer threejs examples scale factor

[jvntf]

mapbox-gl-js version: N/A

Question

Thanks for the great example of loading a GLTF 3D model with 3JS here. Can anyone explain how the scale factor that was used, was chosen? I cannot find any information on where 5.41843220338983e-8 comes from. Thanks!

Links to related documentation

Live demo of the the same example

[ryanhamley]

@ryanbaumann do you remember how you arrived at that number?

[1ec5]

The scale came from @andrewharvey’s original gist: https://gist.github.com/andrewharvey/7b61e9bdb4165e8832b7495c2a4f17f7#file-index-html

[andrewharvey]

The scale from the example, was found by hand (I had a slider and manually found the right value so that the model lined up with the map).

I'm working on a PR to improve the example to remove this magic number, but essentially if your model is in meters, then:

var scaleFactor = 1 / Math.cos(modelOrigin[1] * Math.PI / 180);
var mercatorExtent = 2 * Math.PI * 6378137;
var modelScale = 1 / mercatorExtent * scaleFactor;

Of course if you're just loading a building this is fine, if your model is a whole country, then you'll still have errors since you're not projecting the model, but that's a whole different matter.

[peterqliu]

closing, barring further actions

[andrewharvey]

I agree, the explanation here should suffice. We'll have #8524 in the next release which together with https://github.com/mapbox/mapbox-gl-js-docs/pull/23 does away with the magic number for the scale factor.