Post #1708583

2026-04-11 17:24 UTC

How few &lt;path&gt;s do you need to create a full railway in SVG? (and &lt;mask&gt;, &lt;use&gt;, and &lt;group&gt;s). I've been working on this process for drawing railways in SVG, just based on cloning paths with various strokes. Not computing anything, just letting the SVG renderer handle rasterizing the stroke widths and compositing it all together. It works pretty well, but the exclusion mask to handle junctions renders slowly, and obviously it cannot recreate real track geometry (that would require direction on the strokes, for one). The answer, btw, is up to (2+2n) masks, (6+3n) groups, and (4+9n) clones for each layer of a track, with n components. Each layer may need n components to avoid self-intersecting tracks, and the layers serve to allow grade-separated tracks to occlude lower ones.

Replies (2)

@monoidmusician@tech.lgbt 2026-04-11 17:28

(sorry for rustbaiting you :rust:, railroads involve a lot of rust) (wait why does 🦀 show up for rust hahaha)

Open ##1890860
@monoidmusician@tech.lgbt 2026-04-25 15:44

now with 50% fewer derails! still sticking to plain strokes, it's possible to implement check/guard/wing rails, and it makes it look a lot more convincing active switching elements will require actual scripting, but these check rails just require extracting subsets of each path to mark around each junction (yes, they use markers on the ends like the bridges) this is my silly layout just for testing, don't mind how sharp the curves are for the switch, there is a mask that removes the guard rail from the area where the routes intersect for the three-way switch, it needs two masks (and five paths): one to select no intersections again, and another to select 2-but-not-3 intersections, to paint the wing rails on the inner V

Open ##1890866