我正在写信寻求帮助,我如何更改ChartRangeFilter控件的格式,以便显示每日日期,而不是年份:
当前输出:
我应该查看他们特定的控制器属性:
function drawVisualization(dataValues, chartTitle, columnNames, categoryCaption) {
if (dataValues.length < 1)
return;
var data = new google.visualization.DataTable();
data.addColumn('string', columnNames.split(',')[0], 'Name');
data.addColumn('number', columnNames.split(',')[1], 'Price');
data.addColumn('string', columnNames.split(',')[2], 'Type');
data.addColumn('datetime', columnNames.split(',')[3], 'Date');
for (var i = 0; i < dataValues.length; i++) {
var date = new Date(parseInt(dataValues[i].Date.substr(6), 10));
data.addRow([dataValues[i].ColumnName, dataValues[i].Value, dataValues[i].Type, date]);
}
var dateFormatter = new google.visualization.DateFormat({ pattern: 'dd MM yyyy' });
var line = new google.visualization.ChartWrapper({
'chartType': 'LineChart',
'containerId': 'PieChartContainer',
'options': {
'width': 950,
'height': 450,
'legend': 'right',
'hAxis': {
'format': "dd-MM-yyyy",
'hAxis.maxValue': 'viewWindow.max',
'maxValue': new Date(2014, 05, 30), 'minValue': new Date(2014, 04, 05),
'viewWindow': { 'max': new Date(2014, 05, 30) },
},
'title': chartTitle,
'chartArea': { 'left': 100, 'top': 100, 'right': 0, 'bottom': 100 },
'tooltip': { isHtml: true }
},
'view': {
'columns': [{
type: 'string',
label: data.getColumnLabel(3),
calc: function (dt, row) {
var date = dt.getValue(row, 3);
return dateFormatter.formatValue(date);
}
}, 1, {
type: 'string',
role: 'tooltip',
calc: function (dt, row) {
return 'Name: ' + dt.getValue(row, 0) + ', Price: ' + +dt.getValue(row, 1) + ', Date: ' + +dt.getFormattedValue(row, 3);
}
}]
}
});
var myIdSlider = new google.visualization.ControlWrapper({
'controlType': 'ChartRangeFilter',
'containerId': 'control2',
'options': {
'filterColumnIndex': 3,
'ui': {
'chartView': { 'columns': [3, 1] }
}
}
});
new google.visualization.Dashboard(document.getElementById('PieChartExample')).bind([myIdSlider], [line]).draw(data);
}
请指教。非常感谢。