navbar and map included

added a basic navbar and first map implementation
This commit is contained in:
uwebeschde
2025-02-02 16:28:16 +01:00
parent 29f9cd7941
commit 951714c5c6
14 changed files with 865 additions and 72 deletions

View File

@@ -0,0 +1,27 @@
"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: '&copy; <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-[500px] rounded-lg shadow-lg" />;
}