From 66afc1cee78cc25c905c765eb91be246cc856e64 Mon Sep 17 00:00:00 2001 From: ISA Date: Wed, 4 Jun 2025 07:52:12 +0200 Subject: [PATCH] =?UTF-8?q?cleanup:=20veraltete=20datei=20f=C3=BCr=20Layer?= =?UTF-8?q?s=20gel=C3=B6scht?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/mainComponent/MapComponent.js | 90 ++++++++++---------- config/appVersion.js | 2 +- hooks/layers/useDrawLines.js | 40 --------- hooks/layers/useMessstellenMarkersLayer.js | 39 --------- hooks/{layers => }/useAreaMarkersLayer.js | 16 ++-- hooks/useCreateAndSetDevices.js | 22 ----- hooks/{layers => }/useDynamicDeviceLayers.js | 6 +- hooks/useDynamicMarkerLayers.js | 47 ---------- hooks/useMarkerLayers.js | 26 ------ hooks/usePolylineTooltipLayer.js | 70 --------------- 10 files changed, 57 insertions(+), 301 deletions(-) delete mode 100644 hooks/layers/useDrawLines.js delete mode 100644 hooks/layers/useMessstellenMarkersLayer.js rename hooks/{layers => }/useAreaMarkersLayer.js (89%) delete mode 100644 hooks/useCreateAndSetDevices.js rename hooks/{layers => }/useDynamicDeviceLayers.js (90%) delete mode 100644 hooks/useDynamicMarkerLayers.js delete mode 100644 hooks/useMarkerLayers.js delete mode 100644 hooks/usePolylineTooltipLayer.js diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 2039cd02d..121c82dd6 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -7,74 +7,74 @@ import "leaflet-contextmenu"; import "leaflet.smooth_marker_bouncing"; import "react-toastify/dist/ReactToastify.css"; import { InformationCircleIcon } from "@heroicons/react/20/solid"; -import PoiUpdateModal from "../pois/PoiUpdateModal.js"; +import PoiUpdateModal from "@/components/pois/PoiUpdateModal.js"; import { ToastContainer, toast } from "react-toastify"; import plusRoundIcon from "../icons/devices/overlapping/PlusRoundIcon.js"; import { restoreMapSettings, checkOverlappingMarkers } from "../../utils/mapUtils.js"; -import { APP_VERSION } from "../../config/appVersion.js"; -import addItemsToMapContextMenu from "../contextmenu/useMapContextMenu.js"; -import useAreaMarkersLayer from "../../hooks/layers/useAreaMarkersLayer.js"; -import { setupPolylines } from "../../utils/polylines/setupPolylines.js"; -import { setupPOIs } from "../../utils/setupPOIs.js"; -import useLineData from "../../hooks/useLineData.js"; -import { useMapComponentState } from "../../hooks/useMapComponentState.js"; -import CoordinatePopup from "../contextmenu/CoordinatePopup.js"; +import { APP_VERSION } from "@/config/appVersion.js"; +import addItemsToMapContextMenu from "@/components/contextmenu/useMapContextMenu.js"; +import useAreaMarkersLayer from "@/hooks/useAreaMarkersLayer.js"; +import { setupPolylines } from "@/utils/polylines/setupPolylines.js"; +import { setupPOIs } from "@/utils/setupPOIs.js"; +import useLineData from "@/hooks/useLineData.js"; +import { useMapComponentState } from "@/hooks/useMapComponentState.js"; +import CoordinatePopup from "@/components/contextmenu/CoordinatePopup.js"; //----------Ui Widgets---------------- -import MapLayersControlPanel from "../uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js"; -import CoordinateInput from "../uiWidgets/CoordinateInput.js"; -import VersionInfoModal from "../uiWidgets/VersionInfoModal.js"; +import MapLayersControlPanel from "@/components/uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js"; +import CoordinateInput from "@/components/uiWidgets/CoordinateInput.js"; +import VersionInfoModal from "@/components/uiWidgets/VersionInfoModal.js"; //----------Daten aus API-------------------- -import { fetchPoiDataService } from "../../services/database/pois/fetchPoiDataByIdService.js"; -import AddPOIModal from "../pois/AddPOIModal.js"; -import { enablePolylineEvents, disablePolylineEvents } from "../../utils/polylines/eventHandlers"; +import { fetchPoiDataService } from "@/services/database/pois/fetchPoiDataByIdService.js"; +import AddPOIModal from "@/components/pois/AddPOIModal.js"; +import { enablePolylineEvents, disablePolylineEvents } from "@/utils/polylines/eventHandlers"; //----------MapComponent.js hooks-------------------- -import useInitializeMap from "./hooks/useInitializeMap"; +import useInitializeMap from "@/components/mainComponent/hooks/useInitializeMap"; //-------------------Redux-------------------- import { useSelector, useDispatch } from "react-redux"; //-------------------Redux-Slices-------------------- -import { setSelectedPoi } from "../../redux/slices/database/pois/selectedPoiSlice.js"; -import { setDisabled } from "../../redux/slices/database/polylines/polylineEventsDisabledSlice.js"; -import { setMapId, setUserId } from "../../redux/slices/urlParameterSlice"; -import { selectMapLayersState } from "../../redux/slices/mapLayersSlice"; -import { setCurrentPoi } from "../../redux/slices/database/pois/currentPoiSlice.js"; -import { selectGisLines } from "../../redux/slices/database/polylines/gisLinesSlice"; -import { selectGisLinesStatus } from "../../redux/slices/webservice/gisLinesStatusSlice"; -import { selectPoiTypData, selectPoiTypStatus } from "../../redux/slices/database/pois/poiTypSlice"; -import { selectPriorityConfig } from "../../redux/slices/database/priorityConfigSlice.js"; +import { setSelectedPoi } from "@/redux/slices/database/pois/selectedPoiSlice.js"; +import { setDisabled } from "@/redux/slices/database/polylines/polylineEventsDisabledSlice.js"; +import { setMapId, setUserId } from "@/redux/slices/urlParameterSlice"; +import { selectMapLayersState } from "@/redux/slices/mapLayersSlice"; +import { setCurrentPoi } from "@/redux/slices/database/pois/currentPoiSlice.js"; +import { selectGisLines } from "@/redux/slices/database/polylines/gisLinesSlice"; +import { selectGisLinesStatus } from "@/redux/slices/webservice/gisLinesStatusSlice"; +import { selectPoiTypData, selectPoiTypStatus } from "@/redux/slices/database/pois/poiTypSlice"; +import { selectPriorityConfig } from "@/redux/slices/database/priorityConfigSlice.js"; import { selectPoiIconsData, selectPoiIconsStatus, -} from "../../redux/slices/database/pois/poiIconsDataSlice"; -import { selectGisLinesStatusFromWebservice } from "../../redux/slices/webservice/gisLinesStatusSlice"; -import { selectGisUserRightsFromWebservice } from "../../redux/slices/webservice/userRightsSlice"; +} from "@/redux/slices/database/pois/poiIconsDataSlice"; +import { selectGisLinesStatusFromWebservice } from "@/redux/slices/webservice/gisLinesStatusSlice"; +import { selectGisUserRightsFromWebservice } from "@/redux/slices/webservice/userRightsSlice"; import { updateCountdown, closePolylineContextMenu, -} from "../../redux/slices/database/polylines/polylineContextMenuSlice.js"; +} from "@/redux/slices/database/polylines/polylineContextMenuSlice.js"; import { selectPolylineVisible, setPolylineVisible, -} from "../../redux/slices/database/polylines/polylineLayerVisibleSlice.js"; -import { selectGisStationsStaticDistrict } from "../../redux/slices/webservice/gisStationsStaticDistrictSlice.js"; +} from "@/redux/slices/database/polylines/polylineLayerVisibleSlice.js"; +import { selectGisStationsStaticDistrict } from "@/redux/slices/webservice/gisStationsStaticDistrictSlice.js"; import { selectGisSystemStatic, setGisSystemStatic, -} from "../../redux/slices/webservice/gisSystemStaticSlice.js"; +} from "@/redux/slices/webservice/gisSystemStaticSlice.js"; //-----------Redux-Thunks------------------- -import { fetchGisStationsMeasurementsThunk } from "../../redux/thunks/webservice/fetchGisStationsMeasurementsThunk"; -import { fetchGisSystemStaticThunk } from "../../redux/thunks/webservice/fetchGisSystemStaticThunk"; -import { fetchGisStationsStaticDistrictThunk } from "../../redux/thunks/webservice/fetchGisStationsStaticDistrictThunk"; -import { fetchGisStationsStatusDistrictThunk } from "../../redux/thunks/webservice/fetchGisStationsStatusDistrictThunk"; -import { fetchLocationDevicesThunk } from "../../redux/thunks/database/fetchLocationDevicesThunk"; -import { fetchPriorityConfigThunk } from "../../redux/thunks/database/fetchPriorityConfigThunk.js"; -import { fetchGisLinesThunk } from "../../redux/thunks/database/polylines/fetchGisLinesThunk.js"; -import { fetchGisLinesStatusThunk } from "../../redux/thunks/webservice/fetchGisLinesStatusThunk"; -import { fetchUserRightsThunk } from "../../redux/thunks/webservice/fetchUserRightsThunk"; -import { fetchPoiIconsDataThunk } from "../../redux/thunks/database/pois/fetchPoiIconsDataThunk.js"; -import { fetchPoiTypThunk } from "../../redux/thunks/database/pois/fetchPoiTypThunk.js"; -import { updateAreaThunk } from "../../redux/thunks/database/area/updateAreaThunk"; +import { fetchGisStationsMeasurementsThunk } from "@/redux/thunks/webservice/fetchGisStationsMeasurementsThunk"; +import { fetchGisSystemStaticThunk } from "@/redux/thunks/webservice/fetchGisSystemStaticThunk"; +import { fetchGisStationsStaticDistrictThunk } from "@/redux/thunks/webservice/fetchGisStationsStaticDistrictThunk"; +import { fetchGisStationsStatusDistrictThunk } from "@/redux/thunks/webservice/fetchGisStationsStatusDistrictThunk"; +import { fetchLocationDevicesThunk } from "@/redux/thunks/database/fetchLocationDevicesThunk"; +import { fetchPriorityConfigThunk } from "@/redux/thunks/database/fetchPriorityConfigThunk.js"; +import { fetchGisLinesThunk } from "@/redux/thunks/database/polylines/fetchGisLinesThunk.js"; +import { fetchGisLinesStatusThunk } from "@/redux/thunks/webservice/fetchGisLinesStatusThunk"; +import { fetchUserRightsThunk } from "@/redux/thunks/webservice/fetchUserRightsThunk"; +import { fetchPoiIconsDataThunk } from "@/redux/thunks/database/pois/fetchPoiIconsDataThunk.js"; +import { fetchPoiTypThunk } from "@/redux/thunks/database/pois/fetchPoiTypThunk.js"; +import { updateAreaThunk } from "@/redux/thunks/database/area/updateAreaThunk"; -import useDynamicDeviceLayers from "../../hooks/layers/useDynamicDeviceLayers"; +import useDynamicDeviceLayers from "@/hooks/useDynamicDeviceLayers.js"; import useDataUpdater from "@/hooks/useDataUpdater"; //----------------------------------------------------------------------------------------------------- diff --git a/config/appVersion.js b/config/appVersion.js index 5717142f0..b018a82f1 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.229"; +export const APP_VERSION = "1.1.230"; diff --git a/hooks/layers/useDrawLines.js b/hooks/layers/useDrawLines.js deleted file mode 100644 index f76f3f99a..000000000 --- a/hooks/layers/useDrawLines.js +++ /dev/null @@ -1,40 +0,0 @@ -// /hooks/layers/useDrawLines.js -import { useEffect } from "react"; -import { useDispatch, useSelector } from "react-redux"; -import { fetchGisLinesThunk } from "../../redux/thunks/database/polylines/fetchGisLinesThunk"; -import { selectGisLines } from "../../redux/slices/database/polylines/gisLinesSlice"; - -const useDrawLines = (setLinePositions) => { - const dispatch = useDispatch(); - const gisLines = useSelector(selectGisLines); - - // Daten laden (nur einmal) - useEffect(() => { - dispatch(fetchGisLinesThunk()); - }, [dispatch]); - - // Linien aus GIS-Daten berechnen - useEffect(() => { - if (!Array.isArray(gisLines)) return; - - try { - const newLinePositions = gisLines.map((item) => { - if (item.points && Array.isArray(item.points)) { - return { - coordinates: item.points.map((point) => [point.x, point.y]), - idModul: item.idModul, - idLD: item.idLD, - }; - } else { - throw new Error("Points missing or not an array"); - } - }); - - setLinePositions(newLinePositions); - } catch (err) { - console.error("❌ Fehler beim Zeichnen der Linien:", err.message); - } - }, [gisLines, setLinePositions]); -}; - -export default useDrawLines; diff --git a/hooks/layers/useMessstellenMarkersLayer.js b/hooks/layers/useMessstellenMarkersLayer.js deleted file mode 100644 index 1dc2afd1e..000000000 --- a/hooks/layers/useMessstellenMarkersLayer.js +++ /dev/null @@ -1,39 +0,0 @@ -/* // /hooks/layers/useMessstellenMarkersLayer.js -import { useEffect, useState } from "react"; -import L from "leaflet"; -import { addContextMenuToMarker } from "../../utils/addContextMenuToMarker"; -import { createAndSetDevices } from "../../utils/createAndSetDevices"; - -const useMessstellenMarkersLayer = (map, oms, GisSystemStatic, priorityConfig) => { - const [messstellenMarkers, setMessstellenMarkers] = useState([]); - - useEffect(() => { - if (GisSystemStatic && GisSystemStatic.length && map) { - createAndSetDevices(13, setMessstellenMarkers, GisSystemStatic, priorityConfig); // Messstellen - } - }, [GisSystemStatic, map, priorityConfig]); - - useEffect(() => { - if (map && messstellenMarkers.length) { - messstellenMarkers.forEach((marker) => { - marker.addTo(map); - oms.addMarker(marker); - - // Popup on mouseover and mouseout - marker.on("mouseover", function () { - this.openPopup(); - }); - marker.on("mouseout", function () { - this.closePopup(); - }); - - addContextMenuToMarker(marker); - }); - } - }, [map, messstellenMarkers, oms]); - - return messstellenMarkers; -}; - -export default useMessstellenMarkersLayer; - */ diff --git a/hooks/layers/useAreaMarkersLayer.js b/hooks/useAreaMarkersLayer.js similarity index 89% rename from hooks/layers/useAreaMarkersLayer.js rename to hooks/useAreaMarkersLayer.js index 853e74e4d..7f907daea 100644 --- a/hooks/layers/useAreaMarkersLayer.js +++ b/hooks/useAreaMarkersLayer.js @@ -3,7 +3,7 @@ import { useEffect, useState, useRef } from "react"; import L from "leaflet"; import "leaflet/dist/leaflet.css"; import { useDispatch } from "react-redux"; -import { updateAreaThunk } from "../../redux/thunks/database/area/updateAreaThunk"; +import { updateAreaThunk } from "@/redux/thunks/database/area/updateAreaThunk"; const customIcon = new L.Icon({ iconUrl: "/img/bereich.png", @@ -23,12 +23,12 @@ const useAreaMarkersLayer = (map, oms, apiUrl, onUpdateSuccess) => { if (!map || areaMarkers.length === 0) return; const mapLayersVisibility = JSON.parse(localStorage.getItem("mapLayersVisibility")) || {}; - const areAllLayersInvisible = Object.values(mapLayersVisibility).every((v) => !v); + const areAllLayersInvisible = Object.values(mapLayersVisibility).every(v => !v); if (areAllLayersInvisible === prevVisibility.current) return; prevVisibility.current = areAllLayersInvisible; - areaMarkers.forEach((marker) => { + areaMarkers.forEach(marker => { if (areAllLayersInvisible) { marker.addTo(map); if (oms) oms.addMarker(marker); @@ -41,7 +41,7 @@ const useAreaMarkersLayer = (map, oms, apiUrl, onUpdateSuccess) => { useEffect(() => { updateMarkersVisibility(); - const handleStorageChange = (event) => { + const handleStorageChange = event => { if (event.key === "mapLayersVisibility") { updateMarkersVisibility(); } @@ -64,7 +64,7 @@ const useAreaMarkersLayer = (map, oms, apiUrl, onUpdateSuccess) => { const data = await response.json(); - const markers = data.map((item) => { + const markers = data.map(item => { const marker = L.marker([item.x, item.y], { icon: customIcon, draggable: true, @@ -80,7 +80,7 @@ const useAreaMarkersLayer = (map, oms, apiUrl, onUpdateSuccess) => { } ); - marker.on("dragend", async (e) => { + marker.on("dragend", async e => { const { lat, lng } = e.target.getLatLng(); try { await dispatch( @@ -112,12 +112,12 @@ const useAreaMarkersLayer = (map, oms, apiUrl, onUpdateSuccess) => { useEffect(() => { if (map) { - areaMarkers.forEach((marker) => marker.addTo(map)); + areaMarkers.forEach(marker => marker.addTo(map)); } return () => { if (map) { - areaMarkers.forEach((marker) => map.removeLayer(marker)); + areaMarkers.forEach(marker => map.removeLayer(marker)); } }; }, [map, areaMarkers]); diff --git a/hooks/useCreateAndSetDevices.js b/hooks/useCreateAndSetDevices.js deleted file mode 100644 index ba826b6e1..000000000 --- a/hooks/useCreateAndSetDevices.js +++ /dev/null @@ -1,22 +0,0 @@ -// /hooks/useCreateAndSetDevices.js -import { useEffect } from "react"; -import { useSelector } from "react-redux"; -import { createAndSetDevices } from "../utils/devices/createAndSetDevices"; -import { selectGisStationsMeasurements } from "../redux/slices/webservice/gisStationsMeasurementsSlice"; - -const useCreateAndSetDevices = (systemId, setMarkersFunction, GisSystemStatic, priorityConfig) => { - const polylineEventsDisabled = useSelector((state) => state.polylineEventsDisabled.disabled); - const measurements = useSelector(selectGisStationsMeasurements); // ✅ NEU - - useEffect(() => { - createAndSetDevices( - systemId, - setMarkersFunction, - GisSystemStatic, - priorityConfig, - measurements // ✅ NEU - ); - }, [systemId, setMarkersFunction, GisSystemStatic, priorityConfig, polylineEventsDisabled, measurements]); -}; - -export default useCreateAndSetDevices; diff --git a/hooks/layers/useDynamicDeviceLayers.js b/hooks/useDynamicDeviceLayers.js similarity index 90% rename from hooks/layers/useDynamicDeviceLayers.js rename to hooks/useDynamicDeviceLayers.js index edcdc4c60..598e3077f 100644 --- a/hooks/layers/useDynamicDeviceLayers.js +++ b/hooks/useDynamicDeviceLayers.js @@ -1,9 +1,9 @@ // /hooks/layers/useDynamicDeviceLayers.js import { useEffect, useRef, useState } from "react"; import L from "leaflet"; -import { createAndSetDevices } from "../../utils/devices/createAndSetDevices"; -import { checkOverlappingMarkers } from "../../utils/mapUtils"; -import plusRoundIcon from "../../components/icons/devices/overlapping/PlusRoundIcon"; +import { createAndSetDevices } from "../utils/devices/createAndSetDevices"; +import { checkOverlappingMarkers } from "../utils/mapUtils"; +import plusRoundIcon from "../components/icons/devices/overlapping/PlusRoundIcon"; /** * Dynamisch GIS-System-Marker erstellen & Sichtbarkeit steuern. diff --git a/hooks/useDynamicMarkerLayers.js b/hooks/useDynamicMarkerLayers.js deleted file mode 100644 index d847e25ea..000000000 --- a/hooks/useDynamicMarkerLayers.js +++ /dev/null @@ -1,47 +0,0 @@ -import { useEffect, useRef } from "react"; -import L from "leaflet"; -import { createAndSetDevices } from "../utils/createAndSetDevices.js"; -import { checkOverlappingMarkers } from "../utils/markerUtils"; -import { plusRoundIcon } from "../components/PlusRoundIcon.js"; - -export const useDynamicMarkerLayers = ( - map, - GisSystemStatic, - mapLayersVisibility, - priorityConfig, - setMarkerStates // Funktion wie setMarkers(z.B. map.setMarkers(prev => ({...prev, [systemName]: markers}))) -) => { - const layerRefs = useRef({}); // dynamisch pro systemName - - useEffect(() => { - if (!map || !Array.isArray(GisSystemStatic?.Systems)) return; - - GisSystemStatic.Systems.forEach(system => { - const { id, System_Name } = system; - - if (!layerRefs.current[System_Name]) { - layerRefs.current[System_Name] = new L.LayerGroup().addTo(map); - } - - // Sichtbarkeit prüfen - const isVisible = mapLayersVisibility?.[System_Name] ?? false; - const layer = layerRefs.current[System_Name]; - layer.clearLayers(); - - createAndSetDevices( - id, - markers => { - setMarkerStates(prev => ({ ...prev, [System_Name]: markers })); - - if (isVisible) { - markers.forEach(marker => layer.addLayer(marker)); - } - - checkOverlappingMarkers(map, markers, plusRoundIcon); - }, - GisSystemStatic, - priorityConfig - ); - }); - }, [map, GisSystemStatic, mapLayersVisibility, priorityConfig]); -}; diff --git a/hooks/useMarkerLayers.js b/hooks/useMarkerLayers.js deleted file mode 100644 index 72771cf32..000000000 --- a/hooks/useMarkerLayers.js +++ /dev/null @@ -1,26 +0,0 @@ -// /hooks/useMarkerLayers.js -import { useEffect } from "react"; -import { useSelector } from "react-redux"; -import { selectMapLayersState } from "../redux/slices/mapLayersSlice"; - -const useMarkerLayers = (map, markers, layerType) => { - const mapLayersVisibility = useSelector(selectMapLayersState); - - useEffect(() => { - if (!map || !markers) return; - - const toggleLayer = (isVisible) => { - markers.forEach((marker) => { - if (isVisible) { - marker.addTo(map); - } else { - map.removeLayer(marker); - } - }); - }; - - toggleLayer(mapLayersVisibility[layerType]); - }, [map, markers, mapLayersVisibility, layerType]); -}; - -export default useMarkerLayers; diff --git a/hooks/usePolylineTooltipLayer.js b/hooks/usePolylineTooltipLayer.js deleted file mode 100644 index b30e6ca07..000000000 --- a/hooks/usePolylineTooltipLayer.js +++ /dev/null @@ -1,70 +0,0 @@ -// hooks/usePolylineTooltipLayer.js -import { useEffect } from "react"; -import L from "leaflet"; -import { setupPolylines } from "../utils/polylines/setupPolylines"; - -//Tooltip an mouse position anzeigen für die Linien -export const usePolylineTooltipLayer = (map, markers, polylines, setMarkers, setPolylines, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, polylineVisible, newPoint, newCoords) => { - useEffect(() => { - if (!map) return; - - // Entferne alte Marker und Polylinien - markers.forEach((marker) => marker.remove()); - polylines.forEach((polyline) => polyline.remove()); - - // Setze neue Marker und Polylinien mit den aktuellen Daten - const { markers: newMarkers, polylines: newPolylines } = setupPolylines( - map, - linePositions, - lineColors, - tooltipContents, - setNewCoords, - tempMarker, - polylineVisible // polylineVisible wird jetzt korrekt übergeben - ); - - newPolylines.forEach((polyline, index) => { - const tooltipContent = tooltipContents[`${linePositions[index].idLD}-${linePositions[index].idModul}`] || "Standard-Tooltip-Inhalt"; - - polyline.bindTooltip(tooltipContent, { - permanent: false, - direction: "auto", - sticky: true, - offset: [20, 0], - pane: "tooltipPane", - }); - - polyline.on("mouseover", (e) => { - const tooltip = polyline.getTooltip(); - if (tooltip) { - const mousePos = e.containerPoint; - const mapSize = map.getSize(); - - let direction = "right"; - - if (mousePos.x > mapSize.x - 100) { - direction = "left"; - } else if (mousePos.x < 100) { - direction = "right"; - } - - if (mousePos.y > mapSize.y - 100) { - direction = "top"; - } else if (mousePos.y < 100) { - direction = "bottom"; - } - - tooltip.options.direction = direction; - polyline.openTooltip(e.latlng); - } - }); - - polyline.on("mouseout", () => { - polyline.closeTooltip(); - }); - }); - - setMarkers(newMarkers); - setPolylines(newPolylines); - }, [map, linePositions, lineColors, tooltipContents, newPoint, newCoords, tempMarker, polylineVisible]); -};