Question

我在使用d3和日期时遇到问题。是否有一个示例显示带有时间维度的堆积条形图？我想想象用户的活动，如乘坐公共汽车，步行等作为条形图。现有的基于数字并且理解起来很复杂。我发现这个https://gist.github.com/anotherjavadude/2940908似乎更好，但对我来说仍然不清楚。

Answer 1

我发现Stacked bar-charts on time scale using D3似乎符合您的需求。

无论如何，我宁愿选择Highcharts并使用其叠加的条形图作为时间序列。

在下面的JSfiddle中，您可以看到我是如何做到的：

http://jsfiddle.net/fwuensche/y1w9nnod/3/

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'My energy consumption'
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 
                         'Jun', 'Jul', 'Aug', 'Sep', 'Oct']
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Consumption [KWh]'
            },
            stackLabels: {
                enabled: true,
                style: {
                    fontWeight: 'bold',
                    color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                }
            }
        },

        // series data goes here

    });
});

希望它有所帮助！

Answer 2

以下是基于日期的条形图示例：http://bl.ocks.org/mbostock/1134768

D3堆积条形图与时间

2 个答案: