我正在使用具有10k大型数据点的google折线图。我想按x轴默认值滚动10,并在滚动时应显示其他值。我需要的就是这个http://jsfiddle.net/highcharts/644Du/29/ 我正在尝试获取这些,但我找不到这些的解决方案
这是html代码
<div id="dashboard_div">
<div id="chart_div"></div>
<div id="range_filter_div"></div>
</div>
这是JavaScript
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Value');
// add 1 year of random data
var val = 50;
for (var i = 1; i < 366; i++) {
val += Math.ceil(Math.random() * 5) * Math.pow(-1, Math.ceil(Math.random() * 2));
data.addRow([new Date(2012, 0, i), val]);
}
/*
var monthly = google.visualization.data.group(data, [{
}], [{
}]);
var filter = new google.visualization.ControlWrapper({
controlType: 'ChartRangeFilter',
containerId: 'range_filter_div',
//dataTable: monthly,
options: {
filterColumnIndex: 0,
ui: {
chartOptions: {
height: 50,
width: 600,
chartArea: {
width: '70%'
}
}
}
},
state: {
range: {
start: new Date(2012, 0, 0),
end: new Date(2012, 0, 31)
}
}
});
// create the chart
var chart = new google.visualization.ChartWrapper({
chartType: 'LineChart',
containerId: 'chart_div',
options: {
height: 300,
width: 600,
chartArea: {
height: '80%',
width: '70%'
}
}
});
var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div'));
dashboard.bind([filter], [chart]);
// snap range to nearest months
google.visualization.events.addListener(filter, 'statechange', function (e) {
if (!e.inProgress) {
var state = filter.getState();
console.log(state);
// move start to beginning of starting month
state.range.start = new Date(state.range.start.getFullYear(), state.range.start.getMonth(), 1);
// move end to end of closing month
state.range.end = new Date(state.range.end.getFullYear(), state.range.end.getMonth() + 1, 0);
filter.setState(state);
dashboard.draw(data);
}
});
dashboard.draw(data);
}
google.load('visualization', '1', {packages:['controls']});
google.setOnLoadCallback(drawChart);
任何人都可以帮助我如何实现这一目标吗?