Question

我已尝试使用以下代码显示图表但由于某种原因无效。我试图用折线图显示图表，颜色点不同。我试图创建谷歌折线图

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization', '1', {packages: ['corechart']});
google.setOnLoadCallback(drawLoadChart);
function drawLoadChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Length');
data.addColumn('number', 'Load');
data.addRows([
[Zero, 0],
[One, 1],
[Two, 2]
]);
var formatter = new google.visualization.NumberFormat({
fractionDigits: 3
});
formatter.format(data, 0);
var view = new google.visualization.DataView(data);
view.setColumns([0, 1, 1]); 
var options = {'width':400,'height':300,
title: 'Load vs Length',
titlePosition: 'out',
legend: {
position: 'none'
},
hAxis: {
title: 'Length (inch)',
viewWindow: {
min: 0
},
format: '#.000'
},
vAxis: {
title: 'Load (pound)',
viewWindow: {
min: 0
}
},
series: {
0: {
color: 'black',
lineWidth: 2
},
1: {
color: 'red',
lineWidth: 0,
pointSize: 5
}
}
};
var loadChart = new google.visualization.LineChart(document.getElementById('line_chart'));
loadChart.draw(view, options);
}
</script>
</head>
<body>
<div id='line_chart'></div>
</body>
</html>

预期图表有以上3点，但当我尝试使用TryItEditor时，图表未显示。

Answer 1

此处代码更改

data.addRows([
[Zero, 0],
[One, 1],
[Two, 2]
]);

到这个

data.addRows([
['Zero', 0],
['One', 1],
['Two', 2]
]);

必须使用引号指定字符串。

图表不显示

1 个答案: