Bereich Tooltip Bereich und Standort enthalten
This commit is contained in:
@@ -24,6 +24,7 @@ function DataSheet() {
|
||||
const setZoomTrigger = useSetRecoilState(zoomTriggerState);
|
||||
const [polylineVisible, setPolylineVisible] = useRecoilState(polylineLayerVisibleState); // Zustand für Polylines
|
||||
const [bereicheVisible, setBereicheVisible] = useState(false); // NEU: Bereiche-Status
|
||||
const [standordVisible, setStandorteVisible] = useState(false); // NEU: Standorte-Status
|
||||
useEffect(() => {
|
||||
// LocalStorage Werte laden
|
||||
const storedPoiVisible = localStorage.getItem("poiVisible");
|
||||
@@ -153,6 +154,12 @@ function DataSheet() {
|
||||
setBereicheVisible(checked);
|
||||
localStorage.setItem("bereicheVisible", checked);
|
||||
};
|
||||
const handleStandorteCheckboxChange = (event) => {
|
||||
if (editMode) return;
|
||||
const { checked } = event.target;
|
||||
setStandorteVisible(checked);
|
||||
localStorage.setItem("standorteVisible", checked);
|
||||
};
|
||||
|
||||
//---------------------------
|
||||
return (
|
||||
@@ -223,6 +230,14 @@ function DataSheet() {
|
||||
Bereiche
|
||||
</label>
|
||||
</div>
|
||||
|
||||
{/* Standorte */}
|
||||
<div className="flex items-center">
|
||||
<input type="checkbox" checked={standordVisible} onChange={handleStandorteCheckboxChange} id="bereiche-checkbox" />
|
||||
<label htmlFor="bereiche-checkbox" className="text-sm ml-2">
|
||||
Standorte
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -55,8 +55,11 @@ const useBereicheMarkersLayer = (map, oms, apiUrl) => {
|
||||
|
||||
// Tooltip statt Popup
|
||||
marker.bindTooltip(
|
||||
`<strong>ID Location:</strong> ${item.idLocation} <br />
|
||||
<strong>ID Map:</strong> ${item.idMaps}`,
|
||||
`
|
||||
<strong>Bereich:</strong> ${item.location_name} <br />
|
||||
<strong>Standort:</strong> ${item.area_name} <br />
|
||||
|
||||
`,
|
||||
{
|
||||
permanent: false, // Tooltip wird nur bei Mouseover angezeigt
|
||||
direction: "top", // Position des Tooltips relativ zum Marker
|
||||
@@ -115,8 +118,10 @@ const useBereicheMarkersLayer = (map, oms, apiUrl) => {
|
||||
|
||||
// Tooltip
|
||||
marker.bindTooltip(
|
||||
`<strong>ID Location:</strong> ${item.idLocation} <br />
|
||||
<strong>ID Map:</strong> ${item.idMaps}`,
|
||||
`
|
||||
<strong>locatin_name:</strong> ${item.location_name} <br />
|
||||
<strong> area_name:</strong> ${item.area_name} <br />
|
||||
`,
|
||||
{
|
||||
permanent: false,
|
||||
direction: "top",
|
||||
|
||||
@@ -13,7 +13,45 @@ export default async function handler(req, res) {
|
||||
return res.status(400).json({ error: "idMaps (Parameter 'm') ist erforderlich" });
|
||||
}
|
||||
|
||||
let query = "SELECT * FROM location_coordinates WHERE idMaps = ?";
|
||||
//let query = "SELECT * FROM location_coordinates WHERE idMaps = ?";
|
||||
/* let query = `
|
||||
SELECT
|
||||
l.name,
|
||||
l.shortname,
|
||||
lc.idMaps
|
||||
FROM
|
||||
talas_v5.location l
|
||||
JOIN
|
||||
talas_v5.location_coordinates lc
|
||||
ON
|
||||
l.idlocation = lc.idlocation
|
||||
WHERE
|
||||
lc.idMap = ?
|
||||
`; */
|
||||
/* let query = `
|
||||
SELECT * FROM talas_v5.location l JOIN talas_v5.location_coordinates lc ON l.idlocation = lc.idlocation WHERE lc.idMaps=?;
|
||||
`; */
|
||||
|
||||
let query = `
|
||||
SELECT
|
||||
l.idlocation,
|
||||
l.name AS location_name,
|
||||
lc.idMaps,
|
||||
a.name AS area_name,
|
||||
lc.x,
|
||||
lc.y
|
||||
FROM
|
||||
talas_v5.location l
|
||||
JOIN
|
||||
talas_v5.location_coordinates lc
|
||||
ON l.idlocation = lc.idlocation
|
||||
JOIN
|
||||
talas_v5.area a
|
||||
ON l.idarea = a.idarea
|
||||
WHERE
|
||||
lc.idMaps = ?;
|
||||
`;
|
||||
|
||||
const queryParams = [idMaps];
|
||||
|
||||
if (idLocation) {
|
||||
@@ -32,10 +70,12 @@ export default async function handler(req, res) {
|
||||
if (results.length > 0) {
|
||||
// Ergebnisse formatieren und zurückgeben
|
||||
const formattedResults = results.map((row) => ({
|
||||
idLocation: row.idLocation,
|
||||
idLocation: row.idlocation, // Prüfe hier auf korrekten Spaltennamen
|
||||
x: row.x,
|
||||
y: row.y,
|
||||
idMaps: row.idMaps,
|
||||
location_name: row.location_name, // Hinzufügen des Alias aus der SQL-Abfrage
|
||||
area_name: row.area_name, // Hinzufügen des Alias aus der SQL-Abfrage
|
||||
}));
|
||||
|
||||
res.status(200).json(formattedResults);
|
||||
|
||||
1
public/img/standort.svg
Normal file
1
public/img/standort.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><path fill="#82aec0" d="M44.27 77.03c.62-.64 1.26-1.26 1.93-1.83c1.97-1.65 7.09-5.48 9.85-3.89c1.64.95 1.4 4.1.8 5.41c-1.49 3.24-5.31 5.97-7.64 8.67c-1.84 2.14-4.04 4.05-6.05 6.05c-3.2 3.21-6.27 6.81-9.74 9.74c-.01 0-21.31 17.99-26.56 22.43c-.66.56-1.63.51-2.24-.09c-.61-.61-.65-1.58-.1-2.24L26.95 94.7c4.39-4.39 8.79-8.79 13.18-13.19c1.41-1.41 2.74-3.02 4.14-4.48"/><path fill="#2f7889" d="M56.88 76.61c-.71-.89-1.48-1.77-2.32-2.62c-.88-.88-1.8-1.69-2.73-2.42c-2.22.93-4.47 2.65-5.63 3.63c-.67.56-1.31 1.18-1.93 1.83c-1.4 1.47-2.72 3.07-4.14 4.48c-1.33 1.33-2.67 2.67-4 4.01c0 0-.24 2.06 2.11 4.41s4.3 2.14 4.3 2.14c.21-.21.41-.42.62-.63c2-2 4.21-3.91 6.05-6.05c2.33-2.7 6.14-5.43 7.64-8.67c.01-.03.02-.08.03-.11"/><path fill="#f44336" d="M40.81 81.59c-4.79-5.16-9.05-10.75-12.51-16.54c-1.46-2.44-3.36-7.29-3.94-11.96c-.67-5.32 3.26-10.16 8.6-10.64c6.54-.59 16.67-.37 24.02 5.06l23.65-23.65l23.65 23.64l-23.65 23.64c5.43 7.34 5.65 17.46 5.07 24c-.49 5.41-5.44 9.32-10.82 8.58c-4.88-.68-9.97-2.77-12.48-4.31c-7.74-4.74-15.15-10.89-21.59-17.82"/><path fill="#f44336" d="m52.77 50.86l27.86-27.01s5.76 7.62 10.14 12.09c4.38 4.46 13.52 11.56 13.52 11.56L77.32 74.46s-9.94.92-17.34-6.48c-8.62-8.63-7.21-17.12-7.21-17.12"/><path fill="#c62828" d="M65.96 56.15c1.2 8.92 4.49 13.92 6.22 15.43c2.79 2.41 6.75 1.26 8.45-.43l23.65-23.65s-9.14-7.09-13.52-11.56s-10.13-12.09-10.13-12.09L69.99 34.09c-1.87 1.8-3.13 4.15-3.53 6.71c-.52 3.39-1.51 7.88-.5 15.35"/><path fill="#f44336" d="M78.87 5.52L68.38 16.01c-1.96 1.53-2.02 3.47-2.02 3.47c-1.08 6.02 4.8 17.13 14.9 27.24c10.11 10.11 21.22 15.98 27.24 14.9c0 0 1.6.13 3.14-1.69l10.82-10.82z"/><path fill="#f44336" d="M122.46 49.11c-4.28 4.86-18.05-1.46-30.09-13.5S74.29 10.1 78.87 5.52s17.93 1.59 30.09 13.5c11.76 11.51 17.88 25.12 13.5 30.09"/><path fill="#ff7555" d="M53.34 51.32c-.08-3.85-7.76-8.46-12.51-4.53c-4.01 3.32-2.39 10.39-.34 14.1c2.27 4.11 5.49 7.92 9.71 9.98c4.23 2.07 10.59.93 8.35-3.2c-2.97-5.48-5.03-8.08-5.21-16.35m39.1-17.96c19.12 18.79 26.11 15.19 27.49 14.12c.98-.75 1.44-2.07 1.56-3.34c.32-3.34-1.89-9.3-3.53-12.17c-4.27-7.47-8.36-11.92-20.4-20.98c-5.32-4.01-13.16-6.34-15.81-4.01c-3.12 2.74-3.45 12.48 10.69 26.38"/></svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
Reference in New Issue
Block a user