Components
Bus marker
A live bus (vehicle) on the map: a Brand body with a bus glyph, a heading indicator and the route number in a tag above or below. Trains share the structure with a line-colour disc.
Contract: components/bus-marker.yaml. States are drawn live by transit.js.
Loading the contract…
iOS app specification
The app's rendering of this component, from the v3 spec.
Map markers
Bus stops are Brand rounded squares. Stations are circles when zoomed out and the station icon from zoom 15. Zoom tiers live in Map.
| Bus | From zoom 16: 20 square, radius 5, Brand fill, 2pt Paper keyline, bus glyph at 52%. Zoom 14–16: 7 square, radius 1.5. Hidden below 14. Selected turns the keyline Ink, with a 1 Paper hairline inside it |
|---|---|
| Station | Below zoom 15: a 10 circle with a 1.5pt Paper keyline, in the line colour at a one-line station and grey (Card 2) at a multi-line station. From zoom 15: the 24 station icon inside a 2pt Paper keyline (26 high), width from the line count. See Station icon. |
| Selection | The keyline turns Ink at the same 2, and a 1.12 scale |
| Hit area | 44 × 44 minimum around every marker |
| Location | 20 dot with 18 halo |
| Elevation | No drop shadow or glow on bus or station markers; a selected marker only turns its keyline Ink. |