Chart.js - オブジェクト配列の適切な使用

Question

私は自分の管理パネルのために何らかのグラフを作成するのにchart.jsを使用していますが、正しいデータセットを作成するためにjson配列のオブジェクトを使用する方法を理解できません。データセットのデータフィールドには何を入れる必要がありますか？

ありがとうございます！シモーネ

は、ここに私のコードです：

var jqxhr = $.ajax({url: api_statistiche, type: "GET",dataType: "json", 
data: {type:"top_most_ingredients",n:15}}) 
.done(function(json) { 
    if (!json) { 
     alert("error 1"); 
     return; 
    } 
    if (json.res!=1 || !json.data) { 
     alert("error 2"); 
     return; 
    } 
    var max=json.data.length; 
    var data=[]; 
    for (i=0;i<max;i++){ 
     el=json.data[i]; 
     data[i]={ 
      label: el.nome, 
      value: el.n 
      }; 

    } 
    console.log(data); // Show 'data' correctly 
var data = { 
datasets: [{ 
    data: ?, 

Answer 1

ありがとうございました！

は解決：

var data=[]; 
data['labels']=[]; 
data['datasets']=[]; 
data['datasets'][0]={ 
    data: [], 
    backgroundColor: [], 
    borderColor: "rgba(0,0,0,0)", 
    label: 'Like' 
}; 
for (i=0;i<max;i++){ 
    el=json.data[i]; 
    data['labels'][i]=el.nome; 
    data['datasets'][0].data[i]=el.n; 
    data['datasets'][0].backgroundColor[i]=getRandomColor(); 
} 

var ctx = document.getElementById("more_like_ingredients"); 
var myNewChart = new Chart(ctx,{type: 'polarArea',data: data}); 

Answer 2

私はあなたがこのようないくつかのオブジェクトが必要だと思う...

ここ

{label: aPalos[u], 
    fillColor: "rgba("+aColoresGraph[u]+",0.05)", 
    strokeColor: "rgba("+aColoresGraph[u]+",0.8)", 
    pointColor: "rgba("+aColoresGraph[u]+",0.8)", 
    pointStrokeColor: "#fff", 
    pointHighlightFill: "#fff", 
    pointHighlightStroke: "rgba("+aColoresGraph[u]+",0.8)", 
    data: aPorcentajes[u] 
} 

それはそれよりよく

を理解するための任意のヘルプだ場合、私は私の方法を残します

_generarLineChart(){ 
    var datos = this.props.historial; 
    var len = datos.length; 

    var aNameS = []; 
    var objHits = []; 
    var dataL = {}; 
    var aPorcentajes = [ 
    [], 
    [], 
    [], 
    [], 
    [], 
    [], 
    [], 
    [], 
    [], 
    [] 
    ]; 
    for (var i=0;i<len;i++){ 
    if(datos[i].selected){ 
     let nombre = datos[i].data.trainingSession.name; 
     let field = datos[i].data.trainingSession.field; 
     let round = datos[i].data.trainingSession.round; 
     if(nombre){ 
     aNameS.push(nombre + ' - Round ' + round + ' ' + field); 
     } else { 
     aNameS.push(field); 
     } 

     let hits = datos[i].data.hits; 
     for (var k=0;k<10;k++){ 
     let porcent; 
     let hit = hits[k][1]; 
     if(hit == 0){ 
      porcent = 100; 
     } else{ 
      porcent = parseInt((hits[k][0]/hits[k][1]) * 100); 
     } 
     aPorcentajes[k].push(porcent); 
     } 

    } 
    } 


    for (var u=0;u<10;u++){ 
    objHits.push({label: aPalos[u], 
     fillColor: "rgba("+aColoresGraph[u]+",0.05)", 
     strokeColor: "rgba("+aColoresGraph[u]+",0.8)", 
     pointColor: "rgba("+aColoresGraph[u]+",0.8)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba("+aColoresGraph[u]+",0.8)", 
     data: aPorcentajes[u] 
    }); 
    } 
    dataL['labels'] = aNameS; 
    dataL['datasets'] = objHits; 
    return dataL; 
} 

と構造チャートのドキュメント http://www.chartjs.org/docs/#bar-chart-data-structure