Animation 多折线图动画代码修改谷歌图表

我从这里找到了代码：

google.load（'visualization'，'1'，{packages:['corechart']，callback:function（）{
var data=new google.visualization.DataTable（）；
数据。添加行（5）；
data.addColumn（'string'，''）；
data.addColumn（'number'，'Sales'）；
数据。添加行（5）；
data.setValue（0,0，'Jan'）；
数据设置值（1,0，'Feb'）；
数据设置值（2,0，'Mar'）；
data.setValue（3,0，'Apr'）；
数据设置值（4,0，'May'）；
变量选项={
标题：“2013年的月销售额”，曲线类型：“功能”，
“vAxis”：{“minValue”：“0”，“maxValue”：6}，“hAxis”：{“SlidedTextAngle”：“45”，“SlidedText”：“true”}，“legend”：{“position”：“top”}，“pointSize”：“5”，
动画：{持续时间：250}
};
var chart=new google.visualization.LineChart（document.getElementById（'test'）；
var指数=0；
var chartData=[5,1,4,2,3]
var drawChart=函数（）{
console.log（'绘图索引'+索引）；
if（索引<图表数据长度）{
data.setValue（index，1，chartData[index++]）；
图表绘制（数据、选项）；
}
}
google.visualization.events.addListener（图表'animationfinish'，drawChart）；
图表绘制（数据、选项）；
图纸（）；
}});

如果我想创建多行，如何修改此代码？谢谢 我不是javascript程序员，也不熟悉OOP 作者是另一位弗拉基米尔，但我无权在他的帖子下发表评论。

google.load（'visualization'，'1'，'{
google.load('visualization', '1', {
  packages: ['corechart'],
  callback: function() {
    var data = new google.visualization.DataTable();
    data.addRows(5);
    data.addColumn('string', '');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Sales2');
    data.addRows(5);
    data.setValue(0, 0, 'Jan');
    data.setValue(1, 0, 'Feb');
    data.setValue(2, 0, 'Mar');
    data.setValue(3, 0, 'Apr');
    data.setValue(4, 0, 'May');

    var options = {
      title: 'Sales by months for 2013 year',
      curveType: 'function',
      "vAxis": {
        "minValue": "0",
        "maxValue": 8
      },
      "hAxis": {
        "slantedTextAngle": "45",
        "slantedText": "true"
      },
      "legend": {
        "position": "top"
      },
      "pointSize": "5",
      animation: {
        duration: 600
      }
    };
    var chart = new google.visualization.LineChart(document.getElementById('test'));

    var index = 0;
    var chartData = [5, 1, 4, 2, 3]
    var drawChart = function() {
      console.log('drawChart index ' + index);
      if (index < chartData.length) {
        data.setValue(index, 1, chartData[index++]);
        chart.draw(data, options);
      }
    }

    var index1 = 0;
    var chartData1 = [1, 3, 4, 6, 5]
    var drawChart1 = function() {
      console.log('drawChart1 index1 ' + index1);
      if (index1 < chartData1.length) {
        data.setValue(index1, 2, chartData1[index1++]);
        chart.draw(data, options);
      }
    }
    google.visualization.events.addListener(chart, 'animationfinish', drawChart);
    google.visualization.events.addListener(chart, 'animationfinish', drawChart1);
    chart.draw(data, options);
    drawChart();
    drawChart1();
  }
});

软件包：['corechart']，
回调：函数（）{
var data=new google.visualization.DataTable（）；
数据。添加行（5）；
data.addColumn（'string'，''）；
data.addColumn（'number'，'Sales'）；
data.addColumn（'number'，'Sales2'）；
数据。添加行（5）；
data.setValue（0,0，'Jan'）；
数据设置值（1,0，'Feb'）；
数据设置值（2,0，'Mar'）；
data.setValue（3,0，'Apr'）；
数据设置值（4,0，'May'）；
变量选项={
标题：“2013年的月销售额”，
curveType:'函数'，
“vAxis”：{
“最小值”：“0”，
“最大值”：8
},
“哈克斯”：{
“倾斜角度”：“45”，
“斜文本”：“真”
},
“传奇”：{
“位置”：“顶部”
},
“点大小”：“5”，
动画：{
持续时间：600
}
};
var chart=new google.visualization.LineChart（document.getElementById（'test'）；
var指数=0；
var chartData=[5,1,4,2,3]
var drawChart=函数（）{
console.log（'绘图索引'+索引）；
if（索引<图表数据长度）{
data.setValue（index，1，chartData[index++]）；
图表绘制（数据、选项）；
}
}
var index1=0；
var chartData1=[1,3,4,6,5]
var drawChart1=函数（）{
console.log（'drawChart1 index1'+index1'）；
if（index1

我明白了！这是代码

但另一个问题是，代码通过了测试并运行得很好，但是当我将其复制粘贴到HTML中时，为什么它不工作？我错过什么了吗？

修复它。应该使用“google.charts.load”而不是“google.load”

google.load('visualization', '1', {
  packages: ['corechart'],
  callback: function() {
    var data = new google.visualization.DataTable();
    data.addRows(5);
    data.addColumn('string', '');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Sales2');
    data.addRows(5);
    data.setValue(0, 0, 'Jan');
    data.setValue(1, 0, 'Feb');
    data.setValue(2, 0, 'Mar');
    data.setValue(3, 0, 'Apr');
    data.setValue(4, 0, 'May');

    var options = {
      title: 'Sales by months for 2013 year',
      curveType: 'function',
      "vAxis": {
        "minValue": "0",
        "maxValue": 8
      },
      "hAxis": {
        "slantedTextAngle": "45",
        "slantedText": "true"
      },
      "legend": {
        "position": "top"
      },
      "pointSize": "5",
      animation: {
        duration: 600
      }
    };
    var chart = new google.visualization.LineChart(document.getElementById('test'));

    var index = 0;
    var chartData = [5, 1, 4, 2, 3]
    var drawChart = function() {
      console.log('drawChart index ' + index);
      if (index < chartData.length) {
        data.setValue(index, 1, chartData[index++]);
        chart.draw(data, options);
      }
    }

    var index1 = 0;
    var chartData1 = [1, 3, 4, 6, 5]
    var drawChart1 = function() {
      console.log('drawChart1 index1 ' + index1);
      if (index1 < chartData1.length) {
        data.setValue(index1, 2, chartData1[index1++]);
        chart.draw(data, options);
      }
    }
    google.visualization.events.addListener(chart, 'animationfinish', drawChart);
    google.visualization.events.addListener(chart, 'animationfinish', drawChart1);
    chart.draw(data, options);
    drawChart();
    drawChart1();
  }
});