如何在仅给出 1 [lat,lon] 对的情况下在传单中绘制矩形标记
How to draw rectangle marker in leaflet given only 1 [lat,lon] pair
我需要在传单地图中围绕一个点绘制一个矩形。点是 [lat,lon] 对。我怎样才能轻松做到这一点?我知道画一个圆很容易。但是如何绘制矩形?
以下代码计算出矩形的坐标,然后将其添加到地图中。
var latLng = L.latLng(your_coordinates);
var currentPoint = map.latLngToContainerPoint(latLng);
var width = 20;
var height = 15;
var xDifference = width / 2;
var yDifference = height / 2;
var southWest = L.point((currentPoint.x - xDifference), (currentPoint.y - yDifference));
var northEast = L.point((currentPoint.x + xDifference), (currentPoint.y + yDifference));
var bounds = L.latLngBounds(map.containerPointToLatLng(southWest),map.containerPointToLatLng(northEast));
L.rectangle(bounds).addTo(map);
以米为单位指定半径时更容易:
您可以通过以下方式实现:
1.- 获取具有给定中心坐标和半径的边界:
let radiusMts = 5500;
let bounds = L.latLng(44.6730555555556, 6.9225).toBounds(radiusMts);
2.- 为 reactangle 添加边界:
L.rectangle(bounds).addTo(map);
此外,您还可以为矩形设置颜色:
L.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);
换句话说,对象 'bounds' 就像一个矩形,因此您将拥有东北、西北、东南和西南坐标。
我需要在传单地图中围绕一个点绘制一个矩形。点是 [lat,lon] 对。我怎样才能轻松做到这一点?我知道画一个圆很容易。但是如何绘制矩形?
以下代码计算出矩形的坐标,然后将其添加到地图中。
var latLng = L.latLng(your_coordinates);
var currentPoint = map.latLngToContainerPoint(latLng);
var width = 20;
var height = 15;
var xDifference = width / 2;
var yDifference = height / 2;
var southWest = L.point((currentPoint.x - xDifference), (currentPoint.y - yDifference));
var northEast = L.point((currentPoint.x + xDifference), (currentPoint.y + yDifference));
var bounds = L.latLngBounds(map.containerPointToLatLng(southWest),map.containerPointToLatLng(northEast));
L.rectangle(bounds).addTo(map);
以米为单位指定半径时更容易:
您可以通过以下方式实现:
1.- 获取具有给定中心坐标和半径的边界:
let radiusMts = 5500;
let bounds = L.latLng(44.6730555555556, 6.9225).toBounds(radiusMts);
2.- 为 reactangle 添加边界:
L.rectangle(bounds).addTo(map);
此外,您还可以为矩形设置颜色:
L.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);
换句话说,对象 'bounds' 就像一个矩形,因此您将拥有东北、西北、东南和西南坐标。