Home▸Algorithms & AI▸City Traffic Grid: Signal Patterns & Throughput (2D)

City Traffic Grid: Signal Patterns & Throughput (2D)

Top-down companion to the 3D traffic grid: resize the road network, set car count and light-cycle length, and switch the intersections between checkerboard, green-wave and fully synced patterns while a live panel reports throughput.

Algorithms & AI2DModerate60 FPS📱 Mobile-adapted⇄ 3D version
2d-n92-city-traffic-grid ↗ Open standalone

This 2D companion drives the same grid-and-signal logic as the 3D original from directly above: cars travel along horizontal and vertical lanes, queue at red lights, and release again on green, while sliders let you resize the road network, add or remove cars and slow down or speed up the signal cycle to watch congestion build or clear.

⚙ Under the hood

Canvas2D top-down traffic grid: cars follow lane offsets and stop at red-phase intersections computed from a shared cycle clock; checkerboard, green-wave and synced phase patterns change how far a car travels before hitting a red light.

traffic flowgrid networktraffic signalsgreen wavethroughput

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)