将Yahoo或Google数据读入javascript对象，以便在google可视化图表中使用

Question

总的来说，我在javascript和web编程方面非常新手。我试着用Google可视化图表API制作股票价格的基本图表。我的数据是雅虎金融或谷歌金融的历史市场数据。

如何将这些金融数据读入javascript对象？

例如，使用python，在从python对象生成图表之前，我可以将这些数据读入字典或DataFrame对象来存储。我想用JS / Jquery /等等来完成这个任务。

下面是一个代码im试图工作的基本示例，在这里im读取来自Google 1天的股票价格信息的JSON响应：

function drawVisualization() {
   // How to get the stock data into my DataTable.?
    var dataTable = google.visualization.arrayToDataTable([
       // [ { "id": "694653" ,"t" : "GOOG" ,"e" : "NASDAQ" ,"l" : "1,133.16" ,"l_fix" : "1133.16" ,"l_cur" : "1,133.16" ,"s": "0" ,"ltt":"1:11PM EST" ,"lt" : "Jan 7, 1:11PM EST" ,"c" : "+15.84" ,"c_fix" : "15.84" ,"cp" : "1.42" ,"cp_fix" : "1.42" ,"ccol" : "chg" } ]

    ], true);

    // Draw the chart.
    var chart = new google.visualization.CandlestickChart(document.getElementById('visualization'));
    chart.draw(dataTable, {legend:'none', width:600, height:400});
}

因此，我的问题是如何将股票数据存储在JavaScript中，然后如何将这些数据传递给google.visualization.arrayToDataTable()？

我直接传递URL吗？或者将URL返回的JSON对象存储在变量中，然后将其传递到google.visualization.arrayToDataTable()中？

Answer 1

假设您已经将数据输入到javascript中，则需要将其解析为Visualization的适当格式(因为代码所暗示的格式不兼容)。您可以这样解析它：

var financeData = /* finance data, assumed in this code to be an array of objects */;
var parsedData = [];

// create row of column headers
parsedData.push(['ID', 'ticker', 'exchange' /* ... filling out all columns you want to use */]);
// parse financeData
for (var i = 0; i < financeData.length; i++) {
    parsedData.push([financeData[i].id, financeData[i].t, financeData[i].e /* ... filling out all columns you want to use */]);
}
var dataTable = google.visualization.arrayToDataTable(parsedData);

编辑-使用雅虎财务数据源使用jQuery AJAX构建DataTable的示例代码

function drawTable () {
    // use jQuery to make an AJAX request for data
    $.ajax({
        url: 'http://finance.yahoo.com/webservice/v1/symbols/allcurrencies/quote?format=json',
        dataType: 'jsonp',
        success: function (json) {
            var data = new google.visualization.DataTable();
            data.addColumn('string', 'Name');
            data.addColumn('string', 'Symbol');
            data.addColumn('number', 'Price');
            data.addColumn('date', 'UTC Time');

            // parse the JSON into the DataTable
            for (var i = 0; i < json.list.resources.length; i++) {
                var name = json.list.resources[i].resource.fields.name;
                var symbol = json.list.resources[i].resource.fields.symbol;
                var price = parseFloat(json.list.resources[i].resource.fields.price);
                var dateTimeArr = json.list.resources[i].resource.fields.utctime.split('T');
                var dateArr = dateTimeArr[0].split('-');
                var year = dateArr[0];
                var month = dateArr[1] - 1; // subtract 1 to make compatible with javascript dates
                var day = dateArr[2];
                var timeArr = dateTimeArr[1].split(/[:\+]/);
                var hour = timeArr[0];
                var minute = timeArr[1];
                var second = timeArr[2];

                data.addRow([name, symbol, price, new Date(year, month, day, hour, minute, second)]);
            }

            var table = new google.visualization.Table(document.querySelector('#table_div'));
            table.draw(data);
        }
    });
}
google.load('visualization', '1', {packages:['table'], callback: drawTable});

看到它在这里工作：http://jsfiddle.net/asgallant/dSWe7/