2016-09-05 8 views
0

私はこのようなデータを生成するためにPiwikのPHPのAPIを使用します。現時点では私のコードは次のようになりますと動作しません、Piwik Json Dataを取得してchart.jsで使用するには?

[ 
{"label":"1680x1050","nb_visits":9,"nb_actions":53,"max_actions":27,"sum_visit_length":3051,"bounce_count":3,"nb_visits_converted":0,"sum_daily_nb_uniq_visitors":7,"sum_daily_nb_users":0,"segment":"resolution==1680x1050"}, 
{"label":"1440x900","nb_visits":1,"nb_actions":1,"max_actions":1,"sum_visit_length":0,"bounce_count":1,"nb_visits_converted":0,"sum_daily_nb_uniq_visitors":1,"sum_daily_nb_users":0,"segment":"resolution==1440x900"} 
] 

と私は、このデータを視覚化するためにchart.jsを使用したい:

var chartjsData = []; 
var chartjsLabel = []; 

$.getJSON("piwik.php", function (json) { 
///src = http://stackoverflow.com/questions/24696329/how-to-use-json-data-in-chart-js 
for (var i = 0; i < json.length; i++) { 
    chartjsData.push(json[i].nb_visits); 
    chartjsLabel.push(json[i].label);  
} 
});  

var barChartData = { 
    labels :[chartjsLabel],datasets : [ 
     { 
      fillColor : "rgba(220,280,220,0.5)", 
      strokeColor : "rgba(220,220,220,1)", 
      data : chartjsData 
     } 
     ] 
    }; 

var ctx = document.getElementById("myChart").getContext("2d"); 

var myChart = new Chart(ctx, { 
    type: 'bar', 
    data: barChartData, 
}); 

誰かが私にchart.jsとpiwikのjsonデータを使って作業する方法の実例を伝えることができますか、ヒントを得て、感謝します。

答えて

0

私はこのようにそれを得た:

var label = []; 
var data = []; 

$.getJSON("piwik.php", function (json) { 
    for (var i = 0; i < json.length; i++) { 
    label.push(json[i].label); 
    data.push(json[i].nb_visits); 
    } 
graph(); 
}); 


function graph(){ 
    var ctx = document.getElementById("myChart"); 
    var myChart = new Chart(ctx, { 
     type: 'bar', 
     data: { 
      labels: label, 
      datasets: [{ 
       label: '', 
       data: data, 
       backgroundColor: [ 
        'rgba(255, 99, 132, 0.2)', 
       ], 
       borderColor: [ 
        'rgba(255,99,132,1)', 
       ], 
       borderWidth: 1 
      }] 
     }, 
     options: { 

     } 
    }); 


}; 
関連する問題