OneBusAway / wayfinder

Modern web app frontend for OneBusAway built in JavaScript with SvelteKit
GNU Affero General Public License v3.0
4 stars 1 forks source link

Show the correct route type icon on the map #39

Closed aaronbrethorst closed 1 month ago

aaronbrethorst commented 1 month ago

Currently, we're only showing bus icons on the map. This should be changed to show the variety of transit route types that OBA supports. Here's the list from the iOS app, which maps to the type value found on a route in the references.

        /// Tram, Streetcar, Light rail. Any light rail or street level system within a metropolitan area.
        case lightRail = 0

        /// Subway, Metro. Any underground rail system within a metropolitan area.
        case subway = 1

        ///  Rail. Used for intercity or long-distance travel.
        case rail = 2

        /// Bus. Used for short- and long-distance bus routes.
        case bus = 3

        /// Ferry. Used for short- and long-distance boat service.
        case ferry = 4

        /// Cable car. Used for street-level cable cars where the cable runs beneath the car.
        case cableCar = 5

        /// Gondola, Suspended cable car. Typically used for aerial cable cars where the car is suspended from the cable.
        case gondola = 6

        /// Funicular. Any rail system designed for steep inclines.
        case funicular = 7

        /// An unknown route type. Shouldn't ever happen.
        case unknown = 999

And the iOS app's algorithm for prioritizing the icon:

    /// The route type that should be used to represent this Stop on a map.
    public var prioritizedRouteTypeForDisplay: Route.RouteType {
        let priorities: [Route.RouteType] = [.ferry, .lightRail, .subway, .rail, .bus]

        for t in priorities {
            if routeTypes.contains(t) {
                return t
            }
        }

        return .unknown
    }

    public lazy var routeTypes: Set<Route.RouteType> = {
        return Set(routes.map { $0.routeType })
    }()

Here's the gist of how this should work:

  1. each time a new stop marker will be shown on the map, match the stop's list of routes to the routes references and create a list of available routes.
  2. Collect the list of type values from the available routes.
  3. Show the icon corresponding to type that is prioritized highest in the list above.

You can find new icons for these other transit types in Font Awesome.

Ferry: https://fontawesome.com/icons/ferry?f=classic&s=solid Light Rail, subway, or cable car: https://fontawesome.com/icons/train-subway?f=classic&s=solid Train: https://fontawesome.com/icons/train?f=classic&s=solid Gondola: https://fontawesome.com/icons/cable-car?f=classic&s=solid

Anything else (bus, funicular, unknown): use the bus icon.

tarunsinghofficial commented 1 month ago

@aaronbrethorst Can you show me a video for the iOS implementation?