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

Linie zu TALAS Layer hinzugefügt

Browse Source
This commit is contained in:
ISA
2024-05-28 14:15:00 +02:00
parent 51f396bc07
commit ee0118244b
1 changed files with 10 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
components/MapComponent.js
View File

@@ -1,6 +1,7 @@
// components/MapComponent.js // components/MapComponent.js
import React, { useEffect, useRef, useState, useMemo, use } from "react"; import React, { useEffect, useRef, useState, useMemo, use } from "react";
import { MapContainer, TileLayer, Polyline, LayerGroup } from "react-leaflet";
import L, { marker } from "leaflet"; import L, { marker } from "leaflet";
import "leaflet/dist/leaflet.css"; import "leaflet/dist/leaflet.css";
import "leaflet-contextmenu/dist/leaflet.contextmenu.css"; import "leaflet-contextmenu/dist/leaflet.contextmenu.css";
@@ -36,7 +37,11 @@ const plusRoundIcon = L.icon({
className: "absolute top-0 left-0 z-10", // Adjust with Tailwind CSS classes className: "absolute top-0 left-0 z-10", // Adjust with Tailwind CSS classes
}); });
const MapComponent = ({ locations, onLocationUpdate }) => { const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
const linePositions = lineCoordinates || [
[52.505, 8],
[52, 8.5],
];
const [showAddStationPopup, setShowAddStationPopup] = useState(false); const [showAddStationPopup, setShowAddStationPopup] = useState(false);
const [userRights, setUserRights] = useState(null); const [userRights, setUserRights] = useState(null);
const setSelectedPoi = useSetRecoilState(selectedPoiState); const setSelectedPoi = useSetRecoilState(selectedPoiState);
@@ -117,6 +122,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
const GMA = new L.layerGroup(); const GMA = new L.layerGroup();
const Sonstige = new L.layerGroup(); const Sonstige = new L.layerGroup();
const TALASICL = new L.layerGroup(); const TALASICL = new L.layerGroup();
const lineLayer = new L.LayerGroup();
const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false); const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false);
const baseUrl = "http://10.10.0.13/talas5/devices/"; const baseUrl = "http://10.10.0.13/talas5/devices/";
@@ -1488,6 +1494,9 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
const toggleLayer = (isVisible) => { const toggleLayer = (isVisible) => {
if (isVisible) { if (isVisible) {
talasMarkers.forEach((marker) => marker.addTo(map)); // Ensure markers are added talasMarkers.forEach((marker) => marker.addTo(map)); // Ensure markers are added
const polyline = L.polyline(linePositions, { color: "red" }).addTo(
TALAS
);
} else { } else {
talasMarkers.forEach((marker) => map.removeLayer(marker)); // Remove markers individually talasMarkers.forEach((marker) => map.removeLayer(marker)); // Remove markers individually
} }