年式データの剣道UIデータ形式

Question

私は剣道のUIを初めて勉強しています。データの書式を設定する方法やグラフに入れる方法を理解する上で問題があります。

var animals = [ 
{ 
    "Animal": "Dog", 
    "2017": 100, 
    "2018": 120, 
    "2019": 130 
}, 
{ 
    "Animal": "Cat", 
    "2017": 50, 
    "2018": 40, 
    "2019": 10 
}, 
{ 
    "Animal": "Mouse", 
    "2017": 10, 
    "2018": 20, 
    "2019": 80 
}, 
{ 
    "Animal": "Pig", 
    "2017": 40, 
    "2018": 45, 
    "2019": 50 
}, 
{ 
    "Animal": "Cow", 
    "2017": 80, 
    "2018": 65, 
    "2019": 60 
} 
] 

私はx軸に沿った年で、折れ線グラフには、このデータを取得したい、とy軸上の対応する値：私は、一例として、次のようなデータを持っています。異なる動物は折れ線グラフ上の個々の線によって表される。

私はウェブをしばらく検索して答えを見つけましたが、何も見つかりませんでした。誰でも私がこの問題を始めるのを手伝ったり、役に立つチュートリアルを教えてくれたら、本当に感謝しています。

Answer 1

これはほとんどの場合必要なものですが、入力データを調整する必要があります。 http://dojo.telerik.com/UnuSu/2

ここでは、あなたのデータを表示するために、サンプルでグラフを調整することができる方法である： http://docs.telerik.com/kendo-ui/controls/charts/overview

http://docs.telerik.com/kendo-ui/controls/charts/overview#see-also

：その他の詳細については

function createChart() { 
    $("#chart").kendoChart({ 
     title: { 
      text: "Your title" 
     }, 
     seriesDefaults: { 
      type: "line" 
     }, 
     series: [{ 
      name: "Dog", 
      data: [100, 120, 130] 
     }, { 
      name: "Cat", 
      data: [50, 40, 10] 
     }, { 
      name: "Mouse", 
      data: [10, 20, 80] 
     },{ 
      name: "Pig", 
      data: [40, 45, 50] 
     },{ 
      name: "Cow", 
      data: [80, 65, 60] 
     }], 
     categoryAxis: { 
      categories: [2017, 2018, 2019] 
     }, 
     tooltip: { 
      visible: true, 
      format: "{0}%", 
      template: "#= series.name #: #= value #" 
     } 
    }); 
} 

$(document).ready(createChart); 
$(document).bind("kendo:skinChange", createChart); 

データ・バインディング、チャートの設定に関するリファレンスを参照してください