gpt4 book ai didi

javascript - data.addRows 在谷歌图表中不起作用

转载 作者:行者123 更新时间:2023-12-04 00:06:37 25 4
gpt4 key购买 nike

我正在尝试使用 google API 绘制折线图。

但是图表没有绘制,我可以在 data.addRows(rows); 中识别出一些错误;因为此 data.addRows 行之后的警报不会弹出。

如果我在 data.addRows(rows) 之前给出它,则会弹出警报。

我不知道这里出了什么问题。非常感谢任何帮助。

<script type="text/javascript">
google.load('visualization', '1.0', {'packages':['corechart']});

function drawLineChart() {
var date = 0;
var status = 0;
var rows = new Array();
var data = new google.visualization.DataTable();
var $attendance_date = new Array();
var $attendance_status = new Array();

$attendance_date[0] = '2004';
$attendance_date[1] = '2005';
$attendance_date[2] = '2006';

$attendance_status[0] = 1;
$attendance_status[1] = 3;
$attendance_status[2] = 5;

rows.push(['Year', 'Sales']);
for(var i = 0; i < 3 ; i++) {
date = $attendance_date[i];
status = parseInt($attendance_status[i]);
rows.push([date, status]);
}

data.addColumn('string', 'Subject');
// alert(rows);
data.addRows(rows);
alert(rows);

var options = {
title: 'My Chart',
'width':900,
'height':320,
'backgroundColor': '#d9d9e4'
};

var chart = new google.visualization.LineChart(document.getElementById('chart_attendance_div'));
chart.draw(data, options);
}
</script>

最佳答案

您正在做的事情有一大堆问题,让我们一一解决。

首先,当使用 addRowaddColumn 时,您可以使用 addColumn 命令定义标题。因此,您可以删除以下行:

rows.push(['Year', 'Sales']); 

其次,当您实际上有两列(“年份”和“销售额”)时,您将单个列定义为“主题”。您应该定义两列:

data.addColumn('string', 'Year');
data.addColumn('number', 'Sales');

完成此操作后,您可以将 addRows 命令与最终(工作)代码一起使用:

function drawVisualization() {
var date = 0;
var status = 0;
var rows = new Array();
var data = new google.visualization.DataTable();
var $attendance_date = new Array();
var $attendance_status = new Array();

$attendance_date[0] = '2004';
$attendance_date[1] = '2005';
$attendance_date[2] = '2006';

$attendance_status[0] = 1;
$attendance_status[1] = 3;
$attendance_status[2] = 5;

// This line is commented out because it should be deleted
// rows.push(['Year', 'Sales']);
for(var i = 0; i < 3 ; i++) {
date = $attendance_date[i];
status = parseInt($attendance_status[i]);
rows.push([date, status]);
}
// This line is commented out because it should be deleted
// data.addColumn('string', 'Subject');

// These lines should be added for column headers
data.addColumn('string', 'Year');
data.addColumn('number', 'Sales');

// alert(rows);
data.addRows(rows);
// alert(rows);

var options = {
title: 'My Chart',
'width':900,
'height':320,
'backgroundColor': '#d9d9e4'
};

var chart = new google.visualization.LineChart(document.getElementById('visualization'));
chart.draw(data, options);
}

但如果您要走到这一步,不妨继续下一步。现在您正在创建一个新数组,在 for 循环中填充它,并将该数组传递给 addRows 命令。为什么不去掉中间人?

      var data = new google.visualization.DataTable();
var $attendance_date = new Array();
var $attendance_status = new Array();

$attendance_date[0] = '2004';
$attendance_date[1] = '2005';
$attendance_date[2] = '2006';

$attendance_status[0] = 1;
$attendance_status[1] = 3;
$attendance_status[2] = 5;

data.addColumn('string', 'Year');
data.addColumn('number', 'Sales');

for(var i = 0; i < 3 ; i++) {
data.addRow([$attendance_date[i], parseInt($attendance_status[i])])
}

Presto,你的代码简单多了,你跳过了一步。

关于javascript - data.addRows 在谷歌图表中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15907173/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com