diff --git a/src/components/FeaturePanel/PublicTransport/LineNumber.tsx b/src/components/FeaturePanel/PublicTransport/LineNumber.tsx index 72ac43b8e..c57733adf 100644 --- a/src/components/FeaturePanel/PublicTransport/LineNumber.tsx +++ b/src/components/FeaturePanel/PublicTransport/LineNumber.tsx @@ -6,6 +6,52 @@ interface LineNumberProps { color: string; } +/** + * A function to map a color name to hex. When a color is not found, it is returned as is, the same goes for hex colors. + * @param color The color to map to hex + * @returns The color in hex format, e.g. #ff0000 + */ +function mapColorToHex(color: string) { + switch (color.toLowerCase()) { + case 'black': + return '#000000'; + case 'gray': + case 'grey': + return '#808080'; + case 'maroon': + return '#800000'; + case 'olive': + return '#808000'; + case 'green': + return '#008000'; + case 'teal': + return '#008080'; + case 'navy': + return '#000080'; + case 'purple': + return '#800080'; + case 'white': + return '#ffffff'; + case 'silver': + return '#c0c0c0'; + case 'red': + return '#ff0000'; + case 'yellow': + return '#ffff00'; + case 'lime': + return '#00ff00'; + case 'aqua': + case 'cyan': + return '#00ffff'; + case 'blue': + return '#0000ff'; + case 'fuchsia': + case 'magenta': + return '#ff00ff'; + default: + return color; + } +} /** * A function to determine whether the text color should be black or white * @param hexBgColor The background color in hex format, e.g. #ff0000 @@ -26,7 +72,7 @@ export const LineNumber: React.FC = ({ name, color }) => { let bgcolor: string; if (!color) bgcolor = darkmode ? '#898989' : '#dddddd'; // set the default color - else bgcolor = color.toLowerCase(); + else bgcolor = mapColorToHex(color); const divStyle: React.CSSProperties = { backgroundColor: bgcolor, diff --git a/src/components/FeaturePanel/PublicTransport/PublicTransport.tsx b/src/components/FeaturePanel/PublicTransport/PublicTransport.tsx index 12419b9d5..ec9f3fd1c 100644 --- a/src/components/FeaturePanel/PublicTransport/PublicTransport.tsx +++ b/src/components/FeaturePanel/PublicTransport/PublicTransport.tsx @@ -81,8 +81,7 @@ export const PublicTransport: React.FC = ({ tags }) => { const isPublicTransport = Object.keys(tags).includes('public_transport') || tags.railway === 'station' || - tags.railway === 'halt' || - tags.railway === 'subway_entrance'; + tags.railway === 'halt'; if (!isPublicTransport) { return null; diff --git a/src/components/FeaturePanel/PublicTransport/requestRoutes.ts b/src/components/FeaturePanel/PublicTransport/requestRoutes.ts index c7c8d667a..fb21ac6e0 100644 --- a/src/components/FeaturePanel/PublicTransport/requestRoutes.ts +++ b/src/components/FeaturePanel/PublicTransport/requestRoutes.ts @@ -8,16 +8,12 @@ export interface LineInformation { export async function requestLines( featureType: 'node' | 'way' | 'relation', id: number, - radius = 150, ) { // use the overpass api to request the lines in const overpassQuery = `[out:csv(ref, colour; false; ';')]; - ${featureType}(${id})->.center; - ( - node(around.center:${radius})["public_transport"="stop_position"]; - nw(around.center:${radius})["highway"="bus_stop"]; - nwr(around.center:${radius})["amenity"="ferry_terminal"]; - ) -> .stops; + ${featureType}(${id}); + rel(bn)["public_transport"="stop_area"]; +node(r: "stop") -> .stops; rel(bn.stops)["route"~"bus|train|tram|subway|light_rail|ferry|monorail"]; out;`;