{"spec_id":"histogram-stepwise","library":"makie","language":"julia","code":"# anyplot.ai\n# histogram-stepwise: Step Histogram\n# Library: makie 0.21.9 | Julia 1.11.9\n# Quality: 94/100 | Created: 2026-09-05\n\nusing CairoMakie\nusing Colors\nusing Random\nusing Statistics\n\nRandom.seed!(42)\n\n# --- Theme tokens -----------------------------------------------------------\nconst THEME    = get(ENV, \"ANYPLOT_THEME\", \"light\")\nconst PAGE_BG  = THEME == \"light\" ? colorant\"#FAF8F1\" : colorant\"#1A1A17\"\nconst INK      = THEME == \"light\" ? colorant\"#1A1A17\" : colorant\"#F0EFE8\"\nconst INK_SOFT = THEME == \"light\" ? colorant\"#4A4A44\" : colorant\"#B8B7B0\"\n\n# Imprint categorical palette — 8 hues, theme-independent, hybrid-v3 sort\nconst IMPRINT_PALETTE = [\n    colorant\"#009E73\",  # 1 — brand green, ALWAYS first series\n    colorant\"#C475FD\",  # 2 — lavender\n    colorant\"#4467A3\", colorant\"#BD8233\", colorant\"#AE3030\",\n    colorant\"#2ABCCD\", colorant\"#954477\", colorant\"#99B314\",\n]\n\n# --- Data ---------------------------------------------------------------\n# One-way commute times (minutes) for two travel modes — overlaid step\n# histograms let the shapes be compared without one distribution occluding\n# the other, which is exactly what stepwise outlines are for.\nn = 900\ncyclist_commutes = max.(28.0 .+ 6.0 .* randn(n), 3.0)\n\n# Drivers show a right-skewed secondary mode: roughly a quarter of trips hit\n# heavy traffic and run noticeably longer, giving the distribution real shape\n# beyond a plain bell curve.\ndriver_base       = 36.0 .+ 7.0 .* randn(n)\ncongestion_hit    = rand(n) .< 0.28\ndriver_commutes   = max.(driver_base .+ congestion_hit .* (16.0 .+ 8.0 .* rand(n)), 3.0)\n\ncyclist_median = median(cyclist_commutes)\ndriver_median  = median(driver_commutes)\n\n# --- Plot -----------------------------------------------------------------\ntitle_str = \"histogram-stepwise · julia · makie · anyplot.ai\"\n\nfig = Figure(\n    resolution      = (1600, 900),\n    fontsize        = 14,\n    backgroundcolor = PAGE_BG,\n)\n\nax = Axis(\n    fig[1, 1];\n    title              = title_str,\n    titlesize          = 23,\n    titlecolor         = INK,\n    xlabel             = \"Commute Time (minutes)\",\n    ylabel             = \"Number of Commuters\",\n    xlabelsize         = 14,\n    ylabelsize         = 14,\n    xlabelcolor        = INK,\n    ylabelcolor        = INK,\n    xticklabelsize     = 12,\n    yticklabelsize     = 12,\n    xticklabelcolor    = INK_SOFT,\n    yticklabelcolor    = INK_SOFT,\n    backgroundcolor    = PAGE_BG,\n    topspinevisible    = false,\n    rightspinevisible  = false,\n    leftspinecolor     = INK_SOFT,\n    bottomspinecolor   = INK_SOFT,\n    xgridvisible       = false,\n    ygridvisible       = true,\n    ygridcolor         = RGBAf(INK.r, INK.g, INK.b, 0.12),\n)\n\nstephist!(ax, cyclist_commutes; bins = 30, color = IMPRINT_PALETTE[1],\n          linewidth = 3.0, label = \"Cyclists\")\nstephist!(ax, driver_commutes; bins = 30, color = IMPRINT_PALETTE[2],\n          linewidth = 4.0, label = \"Drivers\")\n\n# Dashed median markers give each distribution a focal point and make the\n# ~10-minute commute-time gap between modes visible at a glance.\nvlines!(ax, [cyclist_median]; color = (IMPRINT_PALETTE[1], 0.5), linewidth = 2,\n        linestyle = :dash)\nvlines!(ax, [driver_median]; color = (IMPRINT_PALETTE[2], 0.5), linewidth = 2,\n        linestyle = :dash)\n\naxislegend(ax; position = :rt, framevisible = false, labelcolor = INK_SOFT)\n\n# --- Save -------------------------------------------------------------------\nsave(\"plot-$(THEME).png\", fig; px_per_unit = 2)\n"}