2016-10-03 17 views
-1

HighCharts.jsを使用して棒グラフを表示する予定でした。しかし、シリーズ属性のデータは表示されませんでした。私は自分のデータと間違っているのだろうか単純な棒グラフでグラフが表示されない

enter image description here

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  
    }); 
} 

データ変数は、以下の値が含まれています。以下の私のコードを参照してください

enter image description here

:下の画像を参照してください。助けてください。ここに私のjsfiddleがあります。

+0

あなたはplunker – Sajeetharan

+0

@Sajeetharanを作成することができます - >私はjsfiddleを作成しました。上記を参照。 – Qerjiuthn

答えて

1

数値が引用符で囲まれて文字列になっているため、ハイチャートはデータを文字列として表示する方法を知らないためです。そのような数字にそれらを変更する

はそれを修正します:

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/

また、あなたがデータのフォーマット方法を制御できません場合には、あなたはいつも以上の配列を変換することができint型に最初にこのような関数を使用して:

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