HighStocks不更新URL

时间:2013-04-06 12:58:05

标签: ajax json highcharts jsonp highstock

我发布了这个问题AJAX URL update,因为我认为我的代码问题出在AJAX上,但我认为这可能是HighStocks的一个问题。

我有一个带有这些函数的外部.js文件:

    //uses AJAX call to retrieve data and then creates the chart with the data
    function createChart(ticker) {

        $.ajax({
            type: 'post',
            url: 'http://...' + ticker + '....com',
            success: function (data, status) {
            //chart is rendered in here
            }

    //gets the user inputted ticker symbol from a HTML input box
    // and passes to chart function
    function getTicker() {
        var ticker = document.getElementById('userInput').value;
        createChart(ticker);
    }

我的HTML文件只有一个简单的表单,其中包含一个输入框和一个按钮,单击该按钮会调用getTicker函数。由于某种原因,图表没有被创建,AJAX调用似乎不起作用。

这可能与HighStocks有关吗?任何建议将不胜感激。

更新感谢您提出建议,我尝试使用JSONP,但图表仍然无法加载。谁能看到我做错了什么?

        var closePrices = new Array();
    var dateArray = new Array();
    var timeStampArray = new Array();
    var timeClose = new Array();

function jsonCallback(data, ticker) {

            console.log( data );

            //Put all the closing prices into an array and convert to floats
            for(var i=0; i < data.query.results.quote.length; i++)
            {
                closePrices[i] = parseFloat( data.query.results.quote[i].Close );
            }

            //displays the values in the closePrices array
            console.log( closePrices );

            //Put all the dates into an array
            for(var i=0; i < data.query.results.quote.length; i++)
            {
                dateArray[i] = data.query.results.quote[i].date;
            }

            //Convert all the dates into JS Timestamps
            for(var i=0; i < dateArray.length; i++)
            {
                timeStampArray[i] = new Date( dateArray[i] ).getTime();
            }


            for(var i=0; i<data.query.results.quote.length; i++)
            {
                   timeClose.push( [timeStampArray[i], closePrices[i]] );
            }

            timeClose = timeClose.reverse();
            console.log ( timeClose );

            //displays the dateArray
            console.log( dateArray );
            console.log( timeStampArray );

            // Create the chart
        $('#container').highcharts('StockChart', {


            rangeSelector : {
                selected : 1
            },

            title : {
                text : ticker + ' Stock Price'
            },

            series : [{
                name : ticker,
                data: timeClose,
                tooltip: {
                    valueDecimals: 2
                }
            }]
        });
}

function createChart() {  

    var url = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.historicaldata%20where%20symbol%20%3D%20%22' + ticker +'%22%20and%20startDate%20%3D%20%222013-01-01%22%20and%20endDate%20%3D%20%222013-02-25%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=?';
    //Ajax call retrieves the data from Yahoo! Finance API
    $.ajax( url, {
        dataType: "jsonp",  
        success: function(data, status){
            console.log(status);
            jsonCallback(data, ticker);
        },
        error: function( jqXHR, status, error ) {
            console.log( 'Error: ' + error );
        }
    });
}


//Function to get ticker symbol from input box.
function getTicker() {
        var ticker = document.getElementById('userInput').value;
        createChart(ticker);
    }

1 个答案:

答案 0 :(得分:0)

感谢Jeffrey Blake和Pawel Fus的建议。使用JSONP我能够使我的程序正常运行:)