尝试使用外部参数生成图表时出错

时间:2014-08-22 07:04:54

标签: javascript json highcharts

我从服务器检索JSON数据并将其作为系列放入Highchart中。我遇到了这个错误:

  

错误:属性y =“NaN”的值无效highcharts.js:9

如果我从callChart函数发送chartSeries参数,则会发生错误。但是如果我复制chartSeries值并将其直接放在drawChart中,它就能显示图表。但是对于其他参数如chartCategory和chartTitle没有问题。

这是我的代码:

function callChart(){
 for (var i in jsonData){
        console.log('@i '+i);
        console.log('@subSegment i '+jsonData[i].subSegment);
        var chartTitle= jsonData[i].subSegment;
        console.log('categories '+ jsonData[i].categories);
        var chartCategory= jsonData[i].categories;
        console.log('series '+ JSON.stringify(jsonData[i].series));
        var chartSeries=JSON.stringify(jsonData[i].series);
        drawChart($('.chartContainer'),chartSeries,chartCategory,chartTitle);
        break;}}

这是drawChart的代码;

function drawChart(container,chartSeries,chartCategory,chartTitle) {
console.log('@ test');

console.log('@ chartSeries='+chartSeries);
console.log('@ chartCategory='+chartCategory);
console.log('@ chartTitle='+chartTitle);

//it works if I put the chartSeries directly here
/*chartSeries=[{"type":"column","stack":null,"pointPlacement":null,"name":"HDD","linkedTo":null,"id":"hdd","data":[30,30,70,90,37,200],"color":"greenColor","borderWidth":null},{"type":"column","stack":"old","pointPlacement":null,"name":"SSHD","linkedTo":null,"id":"sshd","data":[0,100,40,90,60,90],"color":"yellowColor","borderWidth":null},{"type":"column","stack":"old","pointPlacement":null,"name":"SSD","linkedTo":null,"id":"ssd","data":[50,100,40,90,60,100],"color":"blueColor","borderWidth":null},{"type":"column","stack":"forecast","pointPlacement":null,"name":"HDD","linkedTo":"hdd","id":null,"data":[30,80,40,100,60,90],"color":"greenColor","borderWidth":null},{"type":"column","stack":"forecast","pointPlacement":null,"name":"SSD","linkedTo":"ssd","id":null,"data":[30,80,40,100,60,90],"color":"yellowCollor","borderWidth":null},{"type":"spline","stack":null,"pointPlacement":null,"name":"Share","linkedTo":null,"id":null,"data":[30,80,40,100,60,90],"color":"black","borderWidth":null}] ;
*/
if (!container.length) {
  return;
}

var chart = new Highcharts.Chart({

    tooltip: {
        enabled: true
    },
credits: {
    enabled: false
  },
    chart: {
       renderTo: container[0],
   style: {
      fontFamily: '"Arial", "Helvetica", "sans-serif"',
      fontSize: '12px',
      fontWeight: 'bold'
    },
  marginLeft:60,
  marginRight:65
    },
    title: {
        text: chartTitle
    },
    xAxis: {
        categories: chartCategory
    },
    yAxis: [{
        min: 0,
        title: {
            text: 'Units in 000\' s'
        },
        stackLabels: {
            enabled: false,
            style: {
                fontWeight: 'bold',
                color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
            }
        }
    }, { // Secondary yAxis
        title: {
            text: 'Share',
            style: {
                color: Highcharts.getOptions().colors[0]
            }
        },
        labels: {
            format: '{value} %',
            style: {
                color: Highcharts.getOptions().colors[0]
            }
        },
        opposite: true,
        min: 0,
        max: 100
    }],
   legend: {
     enabled:false

    },
    plotOptions: {
        column: {
            grouping: false,
            stacking: 'normal',
    pointWidth:30

        },
  series:{shadow:false}
    }
,series:chartSeries

});
}

非常感谢。

1 个答案:

答案 0 :(得分:0)

好的,我已经找到了。

而是传递JSON.stringify(jsonData [i] .series),直接传递jsonData [i] .series。

由于