使用本地文件而不是$.getJSON

Using local file instead of $.getJSON

本文关键字:getJSON 文件      更新时间:2023-09-26

我对Javascript很陌生,所以很抱歉。

此链接包含使用AJAX请求的名为jsonp.php的文件中的图表数据。

我试图重新创建它,但使用本地文件,而不是他们服务器上的文件。我可以下载他们的示例jsonp.php文件并将其保存到我的桌面上。

我已经设法把这些代码放在一起,使我能够打开并读取文件。

<!DOCTYPE html>
<html>
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<input type="file" id="files" name="file" />
<div id="container" style="height: 500px; min-width: 500px"></div>?
<script>
function handleFileSelect(evt)
{
    var files = evt.target.files; // FileList object
    for (var i = 0, f; f = files[i]; i++)
    {
        var reader = new FileReader();
        reader.onload = (function(reader)
        {
            return function()
            {
                var contents = reader.result;
                //var lines = contents.split(''n');
                //example('test')
                //////
                //document.getElementById('container').innerHTML=contents;
            }
        })(reader);
        reader.readAsText(f);
    }
}
//function example(a)
//{
//alert('You have chosen: ' + a);
//}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>
</html>

我现在正试图将这两个脚本结合起来,用本地文件显示图表(请参阅链接)。我已经尝试删除ajax调用,并使用renderChart(f) 调用该函数

function renderChart(data) {
    // Create the chart
    window.chart = new Highcharts.StockChart({
        chart : {
            renderTo : 'container'
        },
        rangeSelector : {
            selected : 1
        },
        title : {
            text : 'AAPL Stock Price'
        },
        series : [{
            name : 'AAPL',
            data : data,
            tooltip: {
                valueDecimals: 2
            }
        }]
    });
});

这不起作用。请问哪里出错了

感谢

您发送的JSFiddle中有几个语法错误。这是一个新的JSFiddle,它解决了基本错误。然而,我没有尝试使用格式化为Highcharts应该需要的文件。

提示:尝试在Chrome中使用Javascript控制台查看错误。