Javascript HighChart折线图未显示
我正在使用csv文件中的数据使用Highchart生成一个折线图。这是我的密码:Javascript HighChart折线图未显示,javascript,highcharts,Javascript,Highcharts,我正在使用csv文件中的数据使用Highchart生成一个折线图。这是我的密码: /* Define Initial and basic Options */ var options = { chart: { type: 'line', renderTo: 'graph_container' },
/* Define Initial and basic Options */
var options = {
chart: {
type: 'line',
renderTo: 'graph_container'
},
title: {
text: 'FanniemaeAcquisition Cash Flow'
},
yAxis: {
title: {
text: 'Amount($)'
}
},
series: []
};
/* Parse CSV File */
$.get('{% static "data/FanniemaeAcquisitions.csv" %}', function(csv) {
var lines = csv.split('\n');
var series = {
name: '',
data: []
};
$.each(lines, function (lineNo, line) {
var items = line.split(',');
$.each(items, function (itemNo, item) {
if(itemNo == 1){
if (lineNo == 0){
series.name = item;
} else {
series.data.push(parseFloat(item));
}
}
});
});
options.series.push(series);
console.log(options.series);
});
// Create the chart
var chart = new Highcharts.Chart(options);
然而,这是行不通的。我尝试通过手动输入数据来测试它,如下所示:
series: [{
name: 'Installation',
data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
},
这很好。因此,我查看了传递给系列的变量。起作用的(手动输入):
不起作用的(来自CSV):
有什么想法吗
编辑:好的。这里发生了一些奇怪的事情。Highchart没有显示在网页上,但在我下载PNG时显示。更奇怪的是,如果我手动添加数值,它会显示在网页上,但当我从CSV中提取数值时,图表就会消失。。。但当我下载PNG时,它会显示图表…有什么想法吗
第二次编辑:好的,当我这样做时:console.log(JSON.stringify(options.series[0].data));
没有显示任何内容。这意味着从csv文件解析的值将在生成图形后出现。那么我该如何解决这个问题呢?lol问题是由于Javascript的异步问题造成的。我只是将我的函数包装在一个$中。当
成功时 问题是由于Javascript的异步问题造成的。我只是将我的函数包装在一个$中。当
成功时 也许如果您复制了console.log(options.series)的输出代码>在这里我们可以提供帮助,或者至少是它的一个缩短版本。我做了,这是因为图片无法看到值或csv列,所以可能您的值分析不正确?@Andersh添加图片是不够的。添加console.log(options.series)的输出如果您复制了console.log(options.series)的输出,则enjoylife说的code>会出现问题代码>在这里我们可以提供帮助,或者至少是它的一个缩短版本。我做了,这是因为图片无法看到值或csv列,所以可能您的值分析不正确?@Andersh添加图片是不够的。添加console.log(options.series)的输出代码>作为enjoylife saidOr,只需将图表的创建移动到$get()函数中:。或者只需将图表的创建移动到$get()函数中:。