向Chart添加多个系列

时间:2014-01-25 06:20:29

标签: kendo-ui kendo-dataviz kendo-chart

我目前正在尝试构建一个图表,显示每个日期的产品下载次数。 当前代码的示例如下:

var downloads = [  
  { value: 48, date: new Date("2013/11/01") },
  { value: 50, date: new Date("2013/11/02") },
  { value: 55, date: new Date("2013/11/03") },
  { value: 35, date: new Date("2013/11/04") }
];

$("#chart").kendoChart({
  dataSource: {
    data: downloads
  },
  series: [{
    type: "line",
    aggregate: "avg",
    field: "value",
    categoryField: "date"
  }],
  categoryAxis: {
    baseUnit: "days",
    min: new Date("2013/10/31"),
    max: new Date("2013/11/10"),
    labels: {
      dateFormats: {
        days: "dd/MM"
      }
    }
  }  
});

如果我只需要显示一种产品的数据,它就可以正常工作。如何继续显示另一个产品的下载数据,即在图表中添加另一个系列?

1 个答案:

答案 0 :(得分:4)

右键!我自己想通了。这是:

$("#chart").kendoChart({ 
 seriesDefaults: {
     tooltip: {
         visible: true,
     },
     type:"line",
     aggregate:"avg",
     field:"value",
     categoryField:"date"
 }, 
  series: [{
    name: "Product 1",
    data: [{ value: 48, date: new Date("2013/11/01") }, { value: 50, date: new Date("2013/11/02") }]
    },
{
    name: "Product 2",
    data: [{ value: 55, date: new Date("2013/11/03") }, { value: 35, date: new Date("2013/11/04") }]
    }],
  categoryAxis: {
    baseUnit: "days",
    min: new Date("2013/10/31"),
    max: new Date("2013/11/10"),
    labels: {
      dateFormats: {
        days: "dd/MM"
      }
    }
  }  
});