A branched schematic with an explicit colour and a prepared lane model.
pnpm dlx shadcn@latest add https://tfl.manglekuo.com/r/line-strip.jsonSimple line strip · Station name labels · Station typography tool
Northern line, horizontal and vertical. Separate schematics, not one graph rotated. Duplicate Euston nodes where the corridors run parallel.
Use BranchStrip when you already have a prepared render model and an explicit lineColor. Prefer LineStrip when you still need TfL label recipes and colour resolution.
import { BranchStrip } from "@/components/tfl/diagram/branch-strip"
import { LineStrip } from "@/components/tfl/diagram/line-strip"
import { prepareBranchStrip } from "@/lib/tfl/strip-model"| Need | Use |
|---|---|
| TfL colour, label recipes, prepared schematic | LineStrip with schematic={…} |
| Full control over a prepared lane model | BranchStrip |
It ships with the line-strip registry item. No tfl-ts fetch inside this atom.
BranchStrip takes a LineSchematic of lane and position nodes and edges, an explicit lineColor, and optional prepared nodeLabelLines / segmentStates.
Author separate horizontal and vertical schematics. Do not rotate one graph. Shared stations that diverge and converge, Camden Town, Kennington, are single nodes. Parallel corridors that share a name, Euston, use duplicate nodes with a shared stationKey.
Lane joins follow the Line Diagram Standard, not the geographic Tube map: circular arcs at 45° / 90°, never freeform Béziers. Horizontal strips use in-carriage §6 joins, 45° S when space allows, otherwise 90° R. Vertical strips use platform §11 branch curves, 90° with R3n / R4n.
Northern line, horizontal and vertical. Separate schematics, not one graph rotated. Duplicate Euston nodes where the corridors run parallel.
Use BranchStrip when you already have a prepared render model and an explicit lineColor. Prefer LineStrip when you still need TfL label recipes and colour resolution.
import { BranchStrip } from "@/components/tfl/diagram/branch-strip"
import { LineStrip } from "@/components/tfl/diagram/line-strip"
import { prepareBranchStrip } from "@/lib/tfl/strip-model"| Need | Use |
|---|---|
| TfL colour, label recipes, prepared schematic | LineStrip with schematic={…} |
| Full control over a prepared lane model | BranchStrip |
It ships with the line-strip registry item. No tfl-ts fetch inside this atom.
BranchStrip takes a LineSchematic of lane and position nodes and edges, an explicit lineColor, and optional prepared nodeLabelLines / segmentStates.
Author separate horizontal and vertical schematics. Do not rotate one graph. Shared stations that diverge and converge, Camden Town, Kennington, are single nodes. Parallel corridors that share a name, Euston, use duplicate nodes with a shared stationKey.
Lane joins follow the Line Diagram Standard, not the geographic Tube map: circular arcs at 45° / 90°, never freeform Béziers. Horizontal strips use in-carriage §6 joins, 45° S when space allows, otherwise 90° R. Vertical strips use platform §11 branch curves, 90° with R3n / R4n.