DEV Community

Cover image for Visualize Your Entire GitHub Contribution History as a Stunning 3D Skyline — With Just One Command
Fahim Faisaal
Fahim Faisaal

Posted on

Visualize Your Entire GitHub Contribution History as a Stunning 3D Skyline — With Just One Command

#programming #webdev #beginners #data

Have you ever wanted to see your full GitHub activity — every contribution across years — as an interactive 3D bar chart? With Vizb, you can turn the entire contribution history of any GitHub user into a beautiful, self-contained 3D “skyline” in a single terminal command.

No complex setup. No external servers. Just one pipeline that fetches the data and generates a fully interactive HTML visualization.

What is Vizb?

Vizb is a lightweight CLI tool that transforms tabular data (CSV, JSON, or benchmark output) into interactive charts. It supports multi-dimensional grouping, so dates can be split into Year / Month / Day axes — perfect for turning contribution calendars into 3D skyline charts.

Quick Install

Linux / MacOS 

curl -fsSL https://vizb.goptics.org/install.sh | bash
Enter fullscreen mode Exit fullscreen mode

Windows Powershell 

irm https://vizb.goptics.org/install.ps1 | iex
Enter fullscreen mode Exit fullscreen mode

The Magic Command 

curl -s "https://github-contributions-api.jogruber.de/v4/<username>" \
  | vizb bar \
      --group date \
      --group-pattern '[z{Year}-y{Month}-x{Date}]' \
      --json-path '.contributions' \
      --select 'count{Contributions}' \
      --stat \
      --output index.html
Enter fullscreen mode Exit fullscreen mode

Example: Linus Torvalds

Let’s use the creator of Linux and Git himself. Torvalds has made more than 37,000 contributions across roughly 16 years on GitHub.

Replace <username> with torvalds:

Linux / MacOS 

curl -s "https://github-contributions-api.jogruber.de/v4/torvalds" \
  | vizb bar \
      --group date \
      --group-pattern '[z{Year}-y{Month}-x{Date}]' \
      --json-path '.contributions' \
      --select 'count{Contributions}' \
      --stat \
      --output index.html
Enter fullscreen mode Exit fullscreen mode

Windows Powershell 

(iwr "https://github-contributions-api.jogruber.de/v4/torvalds").Content `
  | vizb bar `
      --group date `
      --group-pattern '[z{Year}-y{Month}-x{Date}]' `
      --json-path '.contributions' `
      --select 'count{Contributions}' `
      --stat `
      --output index.html
Enter fullscreen mode Exit fullscreen mode

Open the generated index.html in any browser. You’ll get an interactive 3D skyline like below:

  • Each year becomes a new layer (z-axis)
  • Months form the depth (y-axis)
  • Individual days become the bars (x-axis)
  • Bar height = contribution count that day

You can rotate, zoom, hover for exact numbers, toggle the statistics panel, and even export the view.

Why This Works So Well

  • The public GitHub Contributions API returns every day’s count in clean JSON
  • Vizb’s smart grouping pattern [z{Year}-y{Month}-x{Date}] automatically builds the 3D axes
  • The entire visualization is a single self-contained HTML file — no dependencies, no complexity

Try it with your own username (or any public profile). In under 10 seconds you’ll have a personal 3D contribution skyline you can share, embed, or just admire.

One command. Your entire GitHub story — visualized.

Top comments (0)