垂直平移Google柱形图

时间:2013-08-20 13:41:58

标签: javascript jquery google-visualization chap-links-library

是否有任何JavaScript或水平平移Google柱形图的示例? 我有几个月的数据,我希望用户能够从左到右查看。这是我想要的功能:http://almende.github.io/chap-links-library/js/graph/examples/example05_gaps_in_data.html。我的用户已经反对使用Annotated TimeLine。

2 个答案:

答案 0 :(得分:5)

您可以将ColumnChart挂钩到ChartRangeFilter并获取AnnotatedTimeline的平移和缩放功能。

[编辑]

新版本的Visualization API支持通过explorer option缩放和平移图表。默认设置允许用户通过单击和拖动来使用滚轮和平移进行缩放。这是一个例子:

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('number', 'X');
    data.addColumn('number', 'Y');
    var y = 50;
    for (var i = 0; i < 1000; i++) {
        y += Math.ceil(Math.random() * 3) * Math.pow(-1, Math.floor(Math.random() * 2));
        data.addRow([i, y]);
    }

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, {
        height: 400,
        width: 600,
        explorer: {
            axis: 'horizontal',
            keepInBounds: true
        }
    });
}
google.load('visualization',

jsfiddle:http://jsfiddle.net/asgallant/KArng/

答案 1 :(得分:0)

具有讽刺意味的是,我引用的库实际上是使用谷歌可视化图表并用它们做一些惊人的事情,包括平移。