Stack Overflow Reputation History Chart

WHAT IT DOES

This userscript transforms the default Stack Overflow reputation graph into a fully interactive D3.js chart. It reads your reputation history directly from the page's reputation tab, parsing both the graph data and the daily reputation list. The chart displays cumulative reputation over time with smooth lines, data point hover details showing exact date, reputation change, cumulative total, and post information. You can zoom in on specific time periods, pan across the timeline, and filter data by post type (questions, answers, accepted answers, or bounties). Toggle annotations to highlight accepted answers and bounty awards directly on the chart, or export your reputation history as a CSV file for external analysis.

WHERE IT RUNS

This script activates automatically on Stack Overflow profile reputation pages (stackoverflow.com/users/*?tab=reputation). It works alongside the native Stack Overflow interface, adding an interactive panel to the page without modifying the underlying site functionality.

HOW TO USE

After installation, navigate to any Stack Overflow profile and click the "Reputation" tab. The script detects the reputation data automatically and renders the interactive chart in a panel. Use the dropdown menus to change the time range (30, 90, 365 days, or all time) and filter posts by type. Hover over any data point to see detailed information about that day's reputation changes. Scroll to zoom in and out on the timeline, or drag to pan across the chart. Toggle annotations to see accepted answers and bounty markers, or export your data as CSV for record-keeping.

THE ACTUAL REASON IT WORKS

Unlike simple graph replacements that merely restyle existing SVG elements, this script performs DOM scraping combined with semantic data reconstruction. It first queries the reputation table to extract per-day changes and post metadata, then cross-references this against the graph's data attributes to validate and supplement missing entries. The parsed data is transformed into a cumulative time series and rendered with D3.js using a monotone X curve interpolation that preserves the visual integrity of discrete daily events. The zoom behavior uses D3's built-in transform system to recalculate scales on the fly rather than redrawing the entire chart, enabling smooth 60fps interactions even with years of reputation data.

THE PANEL

The panel is draggable by its header, allowing you to position it anywhere on the screen. It collapses to a small icon when minimized, preserving screen space while keeping the chart accessible. The panel remembers its position across page loads. Press Escape to close the panel, or click the × button to dismiss it. Settings for time range, filter type, annotation visibility, and line thickness are persisted via GM_setValue, so your preferences carry over between sessions.

PLEASE NOTE

This userscript requires the free BotGentz extension to run. Stack Overflow occasionally updates its HTML structure, which may temporarily affect data parsing; we strive to keep the script compatible with the latest site version. If you encounter issues, try refreshing the page or clearing your browser cache. The script reads reputation data from the page only and does not send any data to external servers. All settings are stored locally in your browser's userscript storage. The chart rendering uses D3.js and d3-annotation libraries loaded from CDN; an internet connection is required for the initial chart display.