29 lines
756 B
TypeScript
29 lines
756 B
TypeScript
"use client";
|
|
import { useEffect, useRef } from "react";
|
|
|
|
import L from "leaflet";
|
|
import "leaflet/dist/leaflet.css";
|
|
|
|
export default () => {
|
|
const mapRef = useRef<HTMLDivElement>(null);
|
|
|
|
useEffect(() => {
|
|
if (!mapRef.current) return;
|
|
|
|
// Initialisiere die Leaflet-Karte
|
|
const map = L.map(mapRef.current).setView([51.1657, 10.4515], 6); // Deutschland
|
|
|
|
// OpenStreetMap Tile Layer hinzufügen
|
|
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
|
|
attribution:
|
|
'© <a href="https://www.openstreetmap.org/copyright">OSM</a> contributors',
|
|
}).addTo(map);
|
|
|
|
return () => {
|
|
map.remove(); // Karte beim Unmounten bereinigen
|
|
};
|
|
}, []);
|
|
|
|
return <div ref={mapRef} className="w-full h-full rounded-lg shadow-lg" />;
|
|
};
|