javascript - How to get mapbox-gl map viewport edges coordinates considering pitch and bearing? - Stack Overflow

admin管理员组

文章数量:1314246

I can't understand how to get map viewport coordinates which will be right after user changes pitch and bearing

This is an example of my code - / I use .getBounds() method but it seems it works wrong.

After clicking on the map before user rotates it I get a right rectangle, after - something ridiculous.

Might I use coordinates wrong but it seems to me mapbox method doesn't work as expected.

I can't understand how to get map viewport coordinates which will be right after user changes pitch and bearing

This is an example of my code - https://jsfiddle/5uwdfhdp/6/ I use .getBounds() method but it seems it works wrong.

After clicking on the map before user rotates it I get a right rectangle, after - something ridiculous.

Might I use coordinates wrong but it seems to me mapbox method doesn't work as expected.

• javascript
• mapbox-gl-js

Share Improve this question Follow edited Dec 8, 2018 at 17:41 Cœur 38.8k2626 gold badges205205 silver badges277277 bronze badges asked May 23, 2018 at 13:57 RantievRantiev 2,26333 gold badges3838 silver badges5959 bronze badges 0

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

The problem is that when you build a rectangle with the orthogonal reflection of coordinates, you do not take into account the rotation and pitch. Try to get a geo-polygon through the pixel coordinates of the container:

const canvas = map.getCanvas()
const w = canvas.width
const h = canvas.height
const cUL = map.unproject ([0,0]).toArray()
const cUR = map.unproject ([w,0]).toArray()
const cLR = map.unproject ([w,h]).toArray()
const cLL = map.unproject ([0,h]).toArray()
const coordinates = [cUL,cUR,cLR,cLL,cUL]
const polygon = turf.polygon([coordinates])

https://jsfiddle/7vzyrx9d/

https://github./mapbox/mapbox-gl-js/issues/2375

本文标签： javascriptHow to get mapboxgl map viewport edges coordinates considering pitch and bearingStack Overflow