From 0d47aa481b1ba5c186353dc984a8f9cbeb06b92d Mon Sep 17 00:00:00 2001 From: Lasse Tyrihjell Date: Mon, 22 Apr 2024 13:55:41 +0200 Subject: [PATCH] Added support for showing vehicle-positions in the map (#174) * Added support for showing vehicle-positions in the map * Update doc --- src/components/Map/index.js | 31 ++++++++++++++++++++++++++++--- 1 file changed, 28 insertions(+), 3 deletions(-) diff --git a/src/components/Map/index.js b/src/components/Map/index.js index 508150f..e4cc8fd 100644 --- a/src/components/Map/index.js +++ b/src/components/Map/index.js @@ -2,7 +2,7 @@ import React, { useState, useEffect, useMemo } from 'react'; import { MapContainer, TileLayer, GeoJSON, useMap } from 'react-leaflet'; import Leaflet from 'leaflet'; import bbox from '@turf/bbox'; -import { lineString, featureCollection } from '@turf/helpers'; +import { lineString, featureCollection, point } from '@turf/helpers'; import lineToPolygon from '@turf/line-to-polygon'; import { toGeoJSON } from '@mapbox/polyline'; import { colors } from '@entur/tokens'; @@ -85,15 +85,40 @@ function getMapData(responseData) { legLines: getLegLines(responseData), flexibleAreas: getFlexibleAreas(responseData), serviceJourney: getServiceJourneyLines(responseData), + vehiclePositions: getVehiclePositions(responseData), }; } +// Returns an array of points +function getVehiclePositions(responseData) { + if (!responseData) return; + + const vehicles = responseData.data?.vehicles; + + if (!vehicles) { + return []; + } + + const vehiclePositions = vehicles + .map((vehicle) => vehicle?.location) + .filter(Boolean) + .map((location) => point([location.longitude, location.latitude])); + + return vehiclePositions; +} + function MapContent({ mapData }) { const map = useMap(); const collection = useMemo(() => { - const { legLines, flexibleAreas, serviceJourney } = mapData; - const allFeatures = [...legLines, ...flexibleAreas, ...serviceJourney]; + const { legLines, flexibleAreas, serviceJourney, vehiclePositions } = + mapData; + const allFeatures = [ + ...legLines, + ...flexibleAreas, + ...serviceJourney, + ...vehiclePositions, + ]; return allFeatures.length > 0 ? featureCollection(allFeatures) : null; }, [mapData]);