{"spec_id":"histogram-stepwise","library":"plotly","language":"python","code":"\"\"\" anyplot.ai\nhistogram-stepwise: Step Histogram\nLibrary: plotly 6.7.0 | Python 3.13.13\nQuality: 80/100 | Created: 2026-05-12\n\"\"\"\n\nimport os\n\nimport numpy as np\nimport plotly.graph_objects as go\n\n\nTHEME = os.getenv(\"ANYPLOT_THEME\", \"light\")\nPAGE_BG = \"#FAF8F1\" if THEME == \"light\" else \"#1A1A17\"\nELEVATED_BG = \"#FFFDF6\" if THEME == \"light\" else \"#242420\"\nINK = \"#1A1A17\" if THEME == \"light\" else \"#F0EFE8\"\nINK_SOFT = \"#4A4A44\" if THEME == \"light\" else \"#B8B7B0\"\nGRID = \"rgba(26,26,23,0.10)\" if THEME == \"light\" else \"rgba(240,239,232,0.10)\"\n\nBRAND = \"#009E73\"\n\n# Data\nnp.random.seed(42)\nvalues = np.random.normal(loc=100, scale=18, size=1200)\n\n# Create histogram\ncounts, bins = np.histogram(values, bins=32)\n\n# Create step line coordinates\nx_coords = []\ny_coords = []\n\nfor i in range(len(counts)):\n    x_coords.append(bins[i])\n    y_coords.append(0)\n    x_coords.append(bins[i])\n    y_coords.append(counts[i])\n    x_coords.append(bins[i + 1])\n    y_coords.append(counts[i])\n    x_coords.append(bins[i + 1])\n    y_coords.append(0)\n\n# Plot\nfig = go.Figure()\nfig.add_trace(\n    go.Scatter(\n        x=x_coords,\n        y=y_coords,\n        mode=\"lines\",\n        line={\"color\": BRAND, \"width\": 3},\n        hovertemplate=\"Value: %{x:.1f}<br>Frequency: %{y}<extra></extra>\",\n    )\n)\n\nfig.update_layout(\n    title={\"text\": \"histogram-stepwise · plotly · anyplot.ai\", \"font\": {\"size\": 28, \"color\": INK}},\n    xaxis={\n        \"title\": {\"text\": \"Value\", \"font\": {\"size\": 22, \"color\": INK}},\n        \"tickfont\": {\"size\": 18, \"color\": INK_SOFT},\n        \"gridcolor\": GRID,\n        \"linecolor\": INK_SOFT,\n        \"zerolinecolor\": INK_SOFT,\n    },\n    yaxis={\n        \"title\": {\"text\": \"Frequency\", \"font\": {\"size\": 22, \"color\": INK}},\n        \"tickfont\": {\"size\": 18, \"color\": INK_SOFT},\n        \"gridcolor\": GRID,\n        \"linecolor\": INK_SOFT,\n        \"zerolinecolor\": INK_SOFT,\n    },\n    paper_bgcolor=PAGE_BG,\n    plot_bgcolor=PAGE_BG,\n    hovermode=\"closest\",\n    margin={\"l\": 80, \"r\": 60, \"t\": 100, \"b\": 80},\n    showlegend=False,\n)\n\nfig.write_image(f\"plot-{THEME}.png\", width=1600, height=900, scale=3)\nfig.write_html(f\"plot-{THEME}.html\", include_plotlyjs=\"cdn\")\n"}