22 lines
686 B
JavaScript
22 lines
686 B
JavaScript
"use client";
|
|
|
|
import { Polyline, useMap } from "react-leaflet";
|
|
import { useEffect } from "react";
|
|
const purpleOptions = { color: "purple" };
|
|
|
|
const FlyToPolyline = ({ polyline }) => {
|
|
const map = useMap();
|
|
|
|
useEffect(() => {
|
|
if (map) {
|
|
const leafletPolyline = L.polyline(polyline); // Create a Leaflet polyline
|
|
const bounds = leafletPolyline.getBounds(); // Get bounds from the polyline
|
|
map.flyToBounds(bounds, { padding: [50, 50] }); // Fly to the polyline bounds
|
|
}
|
|
}, [map, polyline]);
|
|
|
|
return <Polyline pathOptions={purpleOptions} positions={polyline} />; // Render the polyline
|
|
};
|
|
|
|
export default FlyToPolyline;
|