ループIは、配列オブジェクトが

Question

canvasjsにおける線グラフを作成する：

total = 
    [ 
    { 
     date: 5/12/2017, 
     count: 5, 
     type: A 
    }, 
    { 
     date: 5/15/2017, 
     count: 15, 
     type: A 
    }, 
    { 
     date: 5/12/2017, 
     count: 4, 
     type: B 
    }, 
    { 
     date: 5/15/2017, 
     count: 5, 
     type: C 
    }.. 
    ] 

私は、各行がそれぞれのタイプを提示する方法CanvasJSを使用して折れ線グラフでループしての疑問は、X軸が日付を示し、 y軸プレゼントここ

を数える私がこれまで持っているものです。

 var chart = new CanvasJS.Chart("chartContainer", 
     { 
      title: { 
       text: "My Counts" 
      }, 
      axisX: { 
       title: "Date", 
      }, 
      axisY: { 
       title: "Count" 
      }, 
      data: [] 
      }); 

Answer 1

あなたは後でヨーヨーでそれを使用するために別の変数に自分のアレイとストア、データポイント上にforループを実行することができますウルチャート。

var dps1 = []; 
var dps2 = []; 
var dps3 = []; 

for(var i = 0; i < total.length; i++) { 
    if(total[i].type === "A") { 
     dps1.push({x: new Date(total[i].date), y: total[i].count}); 
    } else if(total[i].type === "B") { 
     dps2.push({x: new Date(total[i].date), y: total[i].count}); 
    } else if(total[i].type === "C") { 
     dps3.push({x: new Date(total[i].date), y: total[i].count}); 
    } 
} 

データポイントを保存したら、グラフで使用する必要があります。

data: [{ 
    type: "line", 
    dataPoints: dps1 
}, { 
    type: "line", 
    dataPoints: dps2 
}, { 
    type: "line", 
    dataPoints: dps3 
}]