我正在使用JavaScript创建折线图,但无法在Y轴上显示日期...它只能显示数字。有人可以看看我的代码,然后告诉我如何解决它吗?
google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBackgroundColor);
function drawBackgroundColor() {
var data = new google.visualization.DataTable();
data.addColumn('number', 'X');
data.addColumn('number', 'Daily Data Usage');
data.addRows([
[0, 0], [1, 10], [2, 23], [3, 17], [4, 18], [5, 9],
[6, 11],
]);
var options = {
hAxis: {
title: 'Date'
},
vAxis: {
title: 'Total Data Usage (GB)'
},
backgroundColor: '#f1f8e9'
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
最佳答案
google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBackgroundColor);
function drawBackgroundColor() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'X');
data.addColumn('number', 'Daily Data Usage');
data.addRows([
["Jan 1st, 2016", 0], ["Jan 2nd, 2016", 10], ["Jan 3rd, 2016", 23], ["Jan 4th, 2016", 17], ["Jan 5th, 2016", 18], ["Jan 6th, 2016", 9],
["Jan 7th, 2016", 11],
]);
var options = {
hAxis: {
title: 'Date'
},
vAxis: {
title: 'Total Data Usage (GB)'
},
backgroundColor: '#f1f8e9'
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
您必须解决的是将第一种类型更改为字符串而不是数字。