在Javascript / Google Charts中处理Excel中大量输入数据的最佳方法

时间:2015-10-19 10:31:15

标签: javascript charts google-visualization visualization data-visualization

我正在学习使用Google Charts API来处理来自UNODOC statistics的数据。 我发现this excel文件提供了有关2000 - 2013年世界各国的凶杀案数量和比率的信息。

我使用Google Charts创建了一个区域折线图,显示了美国的凶杀案数量和费率。 这是完整的code。如您所见,我只显示来自美国的数据,我正在将数据硬编码到var data / var data1options / options1变量中直接进入javascript文件

var data = google.visualization.arrayToDataTable([
    ['Year', 'Rate'],
        ['2000' , 5.5],  
        ['2001' , 6.6],
        ['2002' , 5.6],
        ['2003' , 5.6],
        ['2004' , 5.5],
        ['2005' , 5.6],
        ['2006' , 5.8],
        ['2007' , 5.6],
        ['2008' , 5.4],
        ['2009' , 5.0],
        ['2010' , 4.7],
        ['2011' , 4.7],
        ['2012' , 4.7],
        ['2013' , 3.8],
    ]);

var data1 = google.visualization.arrayToDataTable([
        ['Year', 'Homocide count'],
            ['2000' , 15586],
            ['2001' , 19033],
            ['2002' , 16229],
            ['2003' , 16528],
            ['2004' , 16148],
            ['2005' , 16740],
            ['2006' , 17309],
            ['2007' , 17128],
            ['2008' , 16465],
            ['2009' , 15399],
            ['2010' , 14722],
            ['2011' , 14661],
            ['2012' , 14827],
            ['2013' , 12253],
      ]);

首先,我不认为这很好,特别是如果我想输入Excel文件中所包含的所有国家/地区的数据。

加载所有数据的最佳方法是什么,而不是将所有数据从.xls文件手动复制粘贴到javascript代码中?

1 个答案:

答案 0 :(得分:1)

您可以先将xls转换为csv吗?如果是这样,我倾向于使用d3.csv()函数。

d3.csv('file.csv', function(murderData){
    chart here using murderData
})

将图表/地图加载为回调。  M博斯托克有the medicine

EG CSV -

Year,Make,Model,Length
1997,Ford,E350,2.34
2000,Mercury,Cougar,2.38

获取返回

[
  {"Year": "1997", "Make": "Ford", "Model": "E350", "Length": "2.34"},
  {"Year": "2000", "Make": "Mercury", "Model": "Cougar", "Length": "2.38"}
]