Data states
Every vehicle is a vehicle dot, drawn in its line colour in one of five states. The shapes are the system's signature: never reuse a ring, a dashed ring or a dot cut by a slash to mean anything else, and never draw a vehicle without its state.
| State | Shape | Means |
|---|---|---|
| Live | A solid dot | A GPS report younger than the live threshold |
| Ageing | A fainter dot | A report past the live threshold, under the ageing one |
| Estimated | A ring | Placed from the timetable and the latest delay |
| Timetable only | A dashed ring | No real-time data at all |
| No signal | A grey dot cut by a slash | Silent past the ageing threshold, moved on by the timetable |
- Always write the state in words next to the dot. Legends list all five states, in this order, even when one has no vehicles.
color.data-state.no-signalmeans a vehicle has gone silent. Use it for that alone.- No signal is the one state cut by a slash: a diagonal gap,
vehicle-dot.no-signal.cut-widthwide, from the top left of the dot to the bottom right, which shows the surface beneath. Live and no signal are both solid dots, so without the cut they would differ by colour alone, and they would look the same in forced colours, where Windows' contrast themes replace every colour. The cut takes ink away rather than adding it, so the map grows no busier, and it reads down to the smallest dot. - On the map, draw dots on a canvas, with a halo of
color.data-state.haloand, for light line colours on the light map, a hairline ofcolor.data-state.outline. - Aircraft carry these states too, all but timetable only, in a glyph of their own rather than a dot, with the same fill strength, grey and cut: see Map.
No signal keeps moving
A vehicle with no signal keeps moving. From where it was last seen, it follows its path on the timetable plus its last known delay, drawn in the no signal glyph and labelled with the time of its last report: "No signal since 10:42". Left where it was last seen, it would mislead twice: an outage across a feed would look as if the city had stopped, and a dot frozen for twenty minutes would sit far from anywhere the vehicle can be. The glyph, not the position, carries the doubt: the cut dot and its words say the place is a guess, so the dot never needs to stand still to say so.
Thresholds
The age of a vehicle's latest report decides between live, ageing and no signal, and how old is too old depends on how often the feed reports. So the thresholds are the app's. vehicle-dot.live-threshold (60 s) and vehicle-dot.ageing-threshold (5 min) are defaults that suit a feed reporting every few seconds; each app sets its live threshold from its own feed's interval between reports, so that one late report doesn't fade a vehicle that is still reporting, and keeps it under the ageing threshold. An app such as Mylder, whose feed reports once a minute at best, sets its live threshold to 2.5 times the interval between reports, 150 s at 60 s and at most 4 min, and keeps the ageing threshold at 5 min.
The components draw the state they are given and never work one out from a timestamp; the app compares each report's age with its thresholds. Where a screen explains the states, it gives the app's own figures, never the defaults' as fixed facts.
Geometry
The vehicle-dot tokens give the geometry of each shape at any size: insets, stroke widths, the dash, the no-signal cut, and the default age thresholds between live, ageing and no signal, which each app sets for its own feed (Thresholds).
| Token | Value |
|---|---|
vehicle-dot.insetGap between the glyph box and the circle edge | 2 px |
vehicle-dot.haloMap only: land-coloured ring drawn under each dot | 1.6 px |
vehicle-dot.live-thresholdDefault: reports younger than this are live. Each app sets its own from its feed's interval between reports | 60000 ms |
vehicle-dot.ageing-thresholdDefault: reports younger than this (and at least the live threshold old) are ageing; older is no signal. Each app sets its own with its live threshold | 300000 ms |
vehicle-dot.ageing.fill-opacityFill strength of an ageing dot, so it reads fainter than live | 0.42 |
vehicle-dot.ageing.stroke-widthRim of an ageing dot | 1.3 px |
vehicle-dot.ageing.stroke-insetPulls the ageing rim in so the dot keeps its outer size | 0.6 px |
vehicle-dot.estimated.stroke-widthRing of an estimated dot | 1.8 px |
vehicle-dot.estimated.stroke-insetPulls the estimated ring in so the dot keeps its outer size | 0.9 px |
vehicle-dot.timetable.stroke-widthDashed ring of a timetable-only dot | 1.6 px |
vehicle-dot.timetable.stroke-insetPulls the timetable ring in so the dot keeps its outer size | 0.9 px |
vehicle-dot.timetable.dashDash and gap of the timetable-only ring | 2.1px 1.7px |
vehicle-dot.no-signal.cut-widthWidth of the diagonal cut, top left to bottom right, through a no-signal dot, the one shape no other state has | 1.6 px |
color.data-state.no-signalLight#9AA4A9Dark#5F6B71Vehicle dot fill when a vehicle has been silent past the ageing thresholdcolor.data-state.haloLight#EDEFEBcolor.map.landDark#151B1Ecolor.map.landMap only: ring under each dotcolor.data-state.outlineLightrgba(18, 24, 27, 0.45)Darkrgba(0, 0, 0, 0)Map only: outline around light line colours on a light map
Delays
A delay is known only for live, ageing and estimated vehicles. Timetable only and no signal always show an unknown delay ("—"). Delay colours point at the status text colours; color.transit.delay.unknown is the one that misses 4.5:1, kept for the "—" next to stronger text.
color.transit.delay.on-timeLight#067849color.text.successDark#3CCB80color.text.successDelay text when on timecolor.transit.delay.slightLight#12181Bcolor.text.primaryDark#EBEEEBcolor.text.primaryLate by 1–2 mincolor.transit.delay.lateLight#AD3600color.text.dangerDark#FF8655color.text.dangerLate by 3 min or morecolor.transit.delay.earlyLight#2351AFcolor.text.infoDark#7FA6FFcolor.text.infoDelay text when earlycolor.transit.delay.unknownLight#74818Acolor.text.tertiaryDark#74818Acolor.text.tertiaryDelay text when there is no real-time data
Kinds of disruption
Each kind of disruption has its colour, always with its icon and its name. A service notice is the neutral kind, for a message whose fields don't say which of the other four it is: it is shown as received, never guessed into one of them.
color.transit.severity.delayLight#AD3600color.text.dangerDark#FF8655color.text.dangerIcon and label for delayscolor.transit.severity.dataLight#47535Acolor.text.secondaryDark#A2ADB1color.text.secondaryIcon and label for data feed problemscolor.transit.severity.diversionLight#2351AFcolor.text.infoDark#7FA6FFcolor.text.infoIcon and label for diversionscolor.transit.severity.plannedLight#47535Acolor.text.secondaryDark#A2ADB1color.text.secondaryIcon and label for planned workscolor.transit.severity.noticeLight#47535Acolor.text.secondaryDark#A2ADB1color.text.secondaryIcon and label for service notices