Pretty git branch graphs

Question

I\'ve seen some books and articles have some really pretty looking graphs of git branches and commits. How can I make high-quality printable images of git history?

Answer 1

gitg: a gtk-based repository viewer, that's new but interesting and useful
http://git.gnome.org/browse/gitg
I use it currently

Answer 2

Gitgraph.js allows to draw pretty git branches without a repository. Just write a Javascript code that configures your branches and commits and render it in browser.

var gitGraph = new GitGraph({
   template: "blackarrow",
   mode: "compact",
   orientation: "horizontal",
   reverseArrow: true
});

var master = gitGraph.branch("master").commit().commit();
var develop = gitGraph.branch("develop").commit();
master.commit();
develop.commit().commit();
develop.merge(master);

or with metro template:

or with commit messages, authors, and tags:

Test it with JSFiddle.

Generate it with Git Grapher by @bsara.

Answer 3

Gitg is a clone of Gitk and GitX for GNOME (it also works on KDE etc.) which shows a pretty colored graph.

It is actively developed (as of 2012). It lets you sort the commits (graph nodes) either chronologically or topologically, and hide commits that don't lead to a selected branch.

It works fine with large repositories and complex dependency graphs.

Sample screenshots, showing the linux-git and linux-2.6 repositories:

Answer 4

I've added three custom commands: git tree, git stree and git vtree. I'll go over them in that order.

[alias]
    tree = log --all --graph --decorate=short --color --format=format:'%C(bold blue)%h%C(reset) %C(auto)%d%C(reset)\n         %C(black)[%cr]%C(reset)  %x09%C(black)%an: %s %C(reset)'

With git stree and git vtree I've use bash to help with the formatting.

[alias]
    logx = log --all --graph --decorate=short --color --format=format:'%C(bold blue)%h%C(reset)+%C(dim black)(%cr)%C(reset)+%C(auto)%d%C(reset)++\n+++       %C(bold black)%an%C(reset)%C(black): %s%C(reset)'
    stree = !bash -c '"                                                                             \
        while IFS=+ read -r hash time branch message; do                                            \
            timelength=$(echo \"$time\" | sed -r \"s:[^ ][[]([0-9]{1,2}(;[0-9]{1,2})?)?m::g\");     \
            timelength=$(echo \"16+${#time}-${#timelength}\" | bc);                                 \
            printf \"%${timelength}s    %s %s %s\n\" \"$time\" \"$hash\" \"$branch\" \"\";          \
        done < <(git logx && echo);"'

---

[alias]
    logx = log --all --graph --decorate=short --color --format=format:'%C(bold blue)%h%C(reset)+%C(dim black)(%cr)%C(reset)+%C(auto)%d%C(reset)++\n+++       %C(bold black)%an%C(reset)%C(black): %s%C(reset)'
    vtree = !bash -c '"                                                                             \
        while IFS=+ read -r hash time branch message; do                                            \
            timelength=$(echo \"$time\" | sed -r \"s:[^ ][[]([0-9]{1,2}(;[0-9]{1,2})?)?m::g\");     \
            timelength=$(echo \"16+${#time}-${#timelength}\" | bc);                                 \
            printf \"%${timelength}s    %s %s %s\n\" \"$time\" \"$hash\" \"$branch\" \"$message\";  \
        done < <(git logx && echo);"'

---

EDIT: This works with git version 1.9a. The color value 'auto' is apparently making its debut in this release. It's a nice addition because branch names will get a different color. This makes it easier to distinguish between local and remote branches for instance.

Answer 5

Very slightly tweaking Slipp's awesome answer, you can use his aliases to log just one branch:

[alias]
lgBranch1 = log --graph --format=format:'%C(bold blue)%h%C(reset) - %C(bold green)(%ar)%C(reset) %C(white)%s%C(reset) %C(bold white)— %an%C(reset)%C(bold yellow)%d%C(reset)' --abbrev-commit --date=relative
lgBranch2 = log --graph --format=format:'%C(bold blue)%h%C(reset) - %C(bold cyan)%aD%C(reset) %C(bold green)(%ar)%C(reset)%C(bold yellow)%d%C(reset)%n''          %C(white)%s%C(reset) %C(bold white)— %an%C(reset)' --abbrev-commit
lg = !"git lg1"

By leaving off the --all you can now do

git lgBranch1 <branch name>

or even

git lgBranch1 --all

Answer 6

If your repository sits on Gitlab, you can use its graph representation as that is rendered as SVG in your browser.

• Go to your repository's graph view, e.g. https://gitlab.com/gitlab-org/gitter/webapp/network/develop

• Scroll the graph down to the bottom (it lazy loads commits!)

• Use your browser's inspector to copy the SVG element to a new file

• Open it in a renderer of your choice, e.g. Inkscape