我刚刚编写了一个工具，它可以使用HTML/Ccanvas生成一个漂亮的Git提交图。

并提供一个jQuery插件，使其易于使用。

[GitHub]https://github.com/tclh123/commits-graph

预览：

试试dita。它可以将任何ASCII图转换为图像。虽然它的设计没有考虑Git分支，但我对结果印象深刻。

源（txt文件）：

        +--------+
        | hotfix |
        +---+----+
            |
--*<---*<---*
       ^
       |
       \--*<---*
               |
           +---+----+
           | master |
           +--------+

命令：

java -jar ditaa0_9.jar ascii-graph.txt

结果：

它还支持背景色、虚线、不同形状等。请参见示例。

有一个时髦的Git提交图作为Raphael web图形库的演示之一。

这个演示是静态的，但应该很容易获取代码并将静态数据交换为一组实时数据——我认为这只是JSON格式的Git提交数据。

演示在这里：http://dmitrybaranovskiy.github.io/raphael/github/impact.html

Gitgraph.js允许在没有存储库的情况下绘制漂亮的Git分支。只需编写一个JavaScript代码来配置分支和提交并在浏览器中呈现。交互式文档可用。

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);

或使用地铁模板：

或者使用提交消息、作者和标签：

用JSFiddle测试它。

通过@bsara使用GitGraper生成它。

我添加了三个自定义命令：gittree、gitstree和gitvtree。我会按顺序检查它们。

[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)'

使用gitstree和gitvtree，我使用Bash来帮助格式化。

[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);"'

这适用于Git 1.9a版本。颜色值“auto”显然在这个版本中首次出现。这是一个很好的补充，因为分支名称将获得不同的颜色。例如，这使得区分本地分支和远程分支更加容易。

GitGraph（GitGraph）

它生成Git存储库提交历史的PNG或SVG表示。