Ismail/nodeMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Daten abrufen von MySQL-DB-Tabelle poityp, um später in Dropdownmenü einzufügen für dieStation hinzufügen

Browse Source
This commit is contained in:
ISA
2024-04-30 14:20:27 +02:00
parent 9e5b54f91a
commit f6a0a40a14
2 changed files with 59 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
components/MapComponent.js
View File

@@ -197,9 +197,10 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
}, []); // Dependency-Array ist leer, um den Effekt nur beim Mount auszuführen
//------------------------------------------
const offlineTileLayer = "../TileMap/mapTiles/{z}/{x}/{y}.png";
//const onlineTileLayer = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
const onlineTileLayer = "mapTiles/{z}/{x}/{y}.png";
const offlineTileLayer = "../TileMap/mapTiles/{z}/{x}/{y}.png"; // ich habe kein mapTiles lokal
const onlineTileLayer = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
//const onlineTileLayer = "mapTiles/{z}/{x}/{y}.png"; // auf dem Server local
//const onlineTileLayer = "TileMap/mapTiles/{z}/{x}/{y}.png";
// Create map layers
const TALAS = new L.layerGroup();
const ECI = new L.layerGroup();
@@ -389,7 +390,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
const popupContent = L.DomUtil.create("div");
popupContent.innerHTML = `
<form id="addStationForm" class="m-0 p-2 w-full">
<!-- Kommantar von hier
<div class="flex items-center mb-4">
<label for="idPoi" class="block mr-2 flex-none">ID Poi:</label>
@@ -411,7 +412,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
Kommantar bis hier-->
<div class="flex items-center mb-4">
<label for="name" class="block mr-2 flex-none">Name:</label>
<input
@@ -1507,6 +1508,22 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
}
}, [map, zoomTrigger]);
//------------------------------------------
// Funktion zum Abrufen der poiTyp Daten
const fetchPoiTyp = async () => {
try {
const response = await fetch("/api/poiTyp");
const data = await response.json();
console.log("Fetched poiTyp:", data);
} catch (error) {
console.error("Error fetching poiTyp data:", error);
}
};
useEffect(() => {
fetchPoiTyp(); // Rufen Sie diese Funktion beim Laden der Komponente auf
}, []);
//----------------------------------------------------
return (
<>