[英]How do I show the bounding box of a mapboxgl object with 4 corner coordinates?
I want to show a physical bounding box on my map.我想在我的地图上显示一个物理边界框。 Suppose I have four examples points as follows:
假设我有以下四个示例点:
var southWest = new mapboxgl.LngLat(-73.9876, 40.7661);
var northWest = new mapboxgl.LngLat(-73.9397, 41.8002);
var northEast = new mapboxgl.LngLat(-73.9397, 40.8002);
var southEast = new mapboxgl.LngLat(-73.9876, 39.8002);
I know there is a method similar to the following:我知道有一种类似于以下的方法:
var boundingBox = new mapboxgl.LngLatBounds(southWest, northEast);
However, I want a box to account for all 4 coordinates.但是,我想要一个包含所有 4 个坐标的框。 Are there good methods for this?
有什么好的方法吗? I want the box to show up over my existing map that is apart of a React/JS application.
我希望该框显示在我现有的地图上,该地图是 React/JS 应用程序的一部分。
Figured it out!弄清楚了!
var northEast = [131.308594, 46.195042];
var southEast = [117.597656, 8.233237];
var southWest = [79.101563, 32.842674];
var northWest = [86.847656, 44.715514];
map.addSource('route', {
'type': 'geojson',
'data': {
'type': 'Feature',
'properties': {},
'geometry': {
'type': 'LineString',
'coordinates': [
northEast, southEast, southWest, northWest, northEast
]
}
}
});
map.addLayer({
'id': 'route',
'type': 'line',
'source': 'route',
'layout': {
'line-join': 'round',
'line-cap': 'round'
},
'paint': {
'line-color': '#ff0000',
'line-width': 5
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.