如何解决如何放下标记并在该半径内获得一组滞后时间
我的标记目前可以使用 dragend 的事件侦听器拖动。我能够得到那个特定点的滞后和长,但我想得到北、南、东和西坐标。 我认为 getBound() 是我需要的,但我不知道如何在函数式 React 中调用它。
非常感谢任何帮助。
import React from 'react';
import { MapContainer,TileLayer,Marker,Popup } from 'react-leaflet'
import "./Map.css"
function Map({children}) {
return (
<>
{children}
<MapContainer center={[40.678177,-73.944160]} zoom={13} scrollWheelZoom={false}>
<TileLayer
attribution='© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>
<Marker
eventHandlers={{
dragend : (e)=>{
console.log(e)}
}}
draggable={true}
position={[40.678177,-73.944160]}
>
<Popup>
test
</Popup>
</Marker>
</MapContainer>
</>
)
};
export default Map;
解决方法
纬度点没有边界。但是您可以使用 leaflet-geometryutil's destination function 来获取到北、南、东、西一定距离处的点:
import L from 'leaflet';
import 'leaflet-geometryutil';
const distance = 100 // in meters
// within your component:
eventHandlers={{
dragend : (e) => {
const n = L.GeometryUtil.destination(e.latlng,distance)
const s = L.GeometryUtil.destination(e.latlng,180,distance)
const e = L.GeometryUtil.destination(e.latlng,90,distance)
const w = L.GeometryUtil.destination(e.latlng,270,distance)
}}
现在您有了正北、正南、正东和正西的点,距离 dragend 事件发生的地方正好 distance
米。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。