Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create an Orthographic view mode #156

Closed
jscastro76 opened this issue Jan 1, 2021 · 2 comments
Closed

Create an Orthographic view mode #156

jscastro76 opened this issue Jan 1, 2021 · 2 comments
Assignees
Labels
🍏 feature New feature or request 🔍 needs investigation 🙏 suggestion Suggestion to consider
Milestone

Comments

@jscastro76
Copy link
Owner

Related to #154
Mapbox-gl-js doesn’t have an orthographic camera option, indeed the FOV is hardcoded internally to Math.atan(3/4). Despite this FOV is not an init param of the map, is accessible through a private variable of map.transformation._fov, there’s a risk that Mapbox will convert this into a non-accessible member in the future.
Three.js has a pure OrthographicCamera object, but if we use it then the depth calculations for the matrixes and raycast will be wrong as they are developed for PerspectiveCamera

So, the best option seems to change first Mapbox camera FOV to mimic the Orthographic camera view in the best way possible and then replicate this view with Three.js PerspectiveCamera that will keep the right transformation matrixes and depth calculations

@jscastro76 jscastro76 added 🍏 feature New feature or request 🙏 suggestion Suggestion to consider 🔍 needs investigation labels Jan 1, 2021
@jscastro76 jscastro76 added this to the v.2.1.6. milestone Jan 1, 2021
@jscastro76 jscastro76 self-assigned this Jan 1, 2021
@jscastro76
Copy link
Owner Author

If map.transform._fov < 1.8 deck gl manages really bad the fill-extrusions
image

@jscastro76
Copy link
Owner Author

After many different tests and approaches, and considering Mapbox does not fully support an orthographic camera, we will add two different options:

  • To have a full orthographic view through an init param orthographic: true, this will create a THREE.OrthographicCamera and related calculated Matrixes. It will adjust the map.transform.fov to the minimum possible (can't be 0 due to Mapbox limitations). IMPORTANT NOTE This view will present issues with fill-extrusion layers as this .
  • To have any desired FOV perspective provided in degrees, from 0.2 to 1.0 values. It will keep the THREE.PerspectiveCamera and current view through another init param fov: _degrees_

jscastro76 added a commit that referenced this issue Jan 5, 2021
Minor version by [@jscastro76](https://github.com/jscastro76), some enhancements and bugs.

#### ✨ Enhancements

- #111 Show the dimensions of a model
- #151 Remove auxiliary test method on `CameraSync` used to debug #145
- #156 Create an Orthographic view mode
- #159 Create an example for FOV and Orthographic.
  - Added to [09-raycaster.html](https://github.com/jscastro76/threebox/blob/master/examples/09-raycaster.html) as it impacts in raycast and shows fill-extrusions and 3D models together
- #161 Remove obsolete code that is avoiding to be used from React

#### 🪲 Bug fixes
- #152 `obj.raycasted` is ignored when an object is hidden and again visible.
- #157 Bug draggging after removing an object.
- #160 Bug using `utils.equal`

#### 📝 Documentation
- #158 MERCATOR_A constant unused, added an code comment to explain why it was deprecated (nor removed)
- Updated [documentation](/docs/Threebox.md) (`tb.orthographic`, `tb.fov`)
- Updated [README.md](/).
- Updated [Examples](/examples) documentation.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🍏 feature New feature or request 🔍 needs investigation 🙏 suggestion Suggestion to consider
Projects
None yet
Development

No branches or pull requests

1 participant