Question

我有20000多个格式为[日期，数字]的数据点，实际数据是每小时最后一个月的数据。

我想在图表中仅显示最近28天，但使用图表选项explorer.actions：['dragToPan'，'rightClickToReset']查看超过28天的数据。

基本上，我想显示数据的子集，然后滚动到旧数据。

这甚至可能吗？有人可以举例说明它是如何完成的吗？

google.charts.load('current', {
  callback: function () {

    var element = document.getElementById('#chart');

    var data = google.visualization.arrayToDataTable([["Date","hits"],["2017-07-01",30],["2017-07-02",20],["2017-07-03",16],["2017-07-4",10],["2017-07-5",31],["2017-07-6",20],["2017-07-7",2],["2017-07-8",8],["2017-07-09",30],["2017-07-10",20],["2017-07-11",16],["2017-07-12",10],["2017-07-13",31],["2017-07-14",20],["2017-07-15",2],["2017-07-16",8]]);

    var chart = new google.visualization.AreaChart(element);

    var options = {
                width: "100%",
                height: "100%",
                fontSize: 13,
                animation: { duration: 1250, easing: 'out' },
                legend: 'none',
                chartArea: {
                    left: 40,
                    height: "80%",
                    width: "85%"
                },
                explorer: {
                    actions: ['dragToPan', 'rightClickToReset'],
                    axis: 'horizontal',
                    keepInBounds: false
                },
                hAxis: {
                    showTextEvery: 2,
                    textPosition: 'out',
                    format: 'dd MMM yy',                    
                }
            };

    chart.draw(data, options);  
  },
  packages:['corechart']
});

Answer 1

您可以按照https://developers.google.com/chart/interactive/docs/gallery/linechart

使用hAxis.viewWindow.max and hAxis.viewWindow.max

请参阅：https://jsfiddle.net/5h7jxqq8/169/

渲染大型数据集的一部分 - dragToPan

1 个答案: