Получить координаты в React-листовке

#geolocation #react-leaflet

#геолокация #react-листовка

Вопрос:

Я сейчас работаю с React Leaflet, и мне нужно получить координаты позиции, которую я щелкнул на карте. когда я погуглил, я смог найти только latlng в качестве решения, но это не работает. есть идеи? TIA

Ответ №1:

Я нашел решение, приложил код, который мог бы помочь вам в вашей проблеме.

 import React, {useState} from "react";
import {Map, Marker, TileLayer} from "react-leaflet";

const style = {
height: '400px',
width: '100%'
};

export const Ubication = () => {
const [position] = useState([-0.22021954674229854, -78.5127639770508]);//position intitial of map
const [marker, setMarker] = useState({lat: 0, lng: 0});

function changeUbication(e) {
    let {lat, lng} = e.latlng;
    console.info("Lat:", lat);
    console.info("Lng: ",lng);
    setMarker(e.latlng);
}

return (
    <div id="map">
        <Map center={position}
             zoom={13}
             onClick={changeUbication}
             style={style}>
            <TileLayer
                url='https://{s}.tile.osm.org/{z}/{x}/{y}.png'
                attribution='amp;copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'/>
            {(marker.lat !== 0 amp;amp; marker.lng !== 0) amp;amp;
            <Marker position={[marker.lat, marker.lng]}>
            </Marker>}
        </Map>
    </div>)
}