简单条形图不显示图形

Question

我正计划使用 HighCharts.js 显示条形图。但是系列属性中的数据没有显示。见下图：

查看下面我的代码：

exec_dashboard_load_graph(
    'exec_dashboard_collection_disbursement_graph',
    response,
    ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']                    
);  

function exec_dashboard_load_graph(id,data, x){
    var myChart = Highcharts.chart(id, {
        chart: {type: 'column'},
        title: {text: 'Annual Collection and Disbursement Summary'},
        subtitle:{text: 'City Goverment of Butuan'},
        xAxis: {categories: x,crosshair: true},
        yAxis: {min: 0,title: {text: 'Amount (Peso Value)'}},
        tooltip: {
            headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
            pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
            '<td style="padding:0"><b> {point.y:.1f} Php </b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },
        plotOptions: {column: {pointPadding: 0.2,borderWidth: 0}},
        series: data    
    });
}

数据变量包含以下值：

我想知道我的数据出了什么问题。请帮忙。这是我的 jsfiddle.

Answer 1

这是因为你的数字在引号中，使它们成为字符串，而 Highcharts 不知道如何将数据呈现为字符串。

像这样将它们更改为数字即可解决问题：

var collections = new Array(11242282.20,7966734.89,5936262.58,7903113.53,6527188.99,20639705.75,14359971.15,6861212.08,0,0,0,0);
var disbursements = new Array(117015425.13,151452477.46,182264161.40,218257774.81,188822327.59,209183652.51,15081727.17,204713881.30,0,0,0,0);

https://jsfiddle.net/nnfbcuzr/1/

此外，如果您无法控制数据的格式，您始终可以先使用如下函数将数组转换为整数：

function parsValuesToInts(arr) {
  var newArr = [];
  for(var i = 0; i < arr.length; i++){
    newArr.push(parseInt(arr[i],10));
  }
  return newArr;
}

简单条形图不显示图形

Simple Bar Graph Doesn't Show Graph

javascript

highcharts

highstock