Search code examples
kendo-uikendo-datavizkendo-chart

Kendo line chart display gap for null values


I have a set of series where some of the data will be null. With the line type chart it will just connect the previous and next point giving the illusion that the data is connected. I'd like to display a gap in the line for null values. Is there a work around for this?

Here's some sample relevant code:

$("#chart").kendoChart({
  seriesDefaults: {
    type: "line"
  },
  series: [{
    name: "Gaps",
    data: [null, 3.907, null, 7.848, null, 9.263, null, 3.890, 8.238, 9.552]
  }, {
    name: "No Gaps",
    data: [1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, -2.245, 4.339, 2.727]
  }],
  categoryAxis: {
    categories: [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011]
  }
});

Also a working Dojo: http://dojo.telerik.com/ecOKU/2


Solution

  • Just add missingValues: "gap" to the series or seriesDefaults (API DOC):

    seriesDefaults: {
        type: "line",
        missingValues: "gap" 
    },
    

    Updated DOJO