Non-continuous data

Null series values will break the line when rendering, missing values will be skipped

Created with Raphaël 2.1.201,0002,0003,0004,0009/30/20129/28/20129/26/20129/24/20129/22/20129/20/20129/18/20129/16/20129/14/20129/12/20129/10/2012
2012-10-01
Licensed: 3,407
SORN: -
Other: - 
  1. /* data stolen from http://howmanyleft.co.uk/vehicle/jaguar_'e'_type */
  2. var day_data = [
  3.   {"period": "2012-10-01", "licensed": 3407},
  4.   {"period": "2012-09-30", "sorned": 0},
  5.   {"period": "2012-09-29", "sorned": 618},
  6.   {"period": "2012-09-20", "licensed": 3246, "sorned": 661},
  7.   {"period": "2012-09-19", "licensed": 3257, "sorned": null},
  8.   {"period": "2012-09-18", "licensed": 3248, "other": 1000},
  9.   {"period": "2012-09-17", "sorned": 0},
  10.   {"period": "2012-09-16", "sorned": 0},
  11.   {"period": "2012-09-15", "licensed": 3201, "sorned": 656},
  12.   {"period": "2012-09-10", "licensed": 3215}
  13. ];
  14. Morris.Line({
  15.   element: 'graph',
  16.   data: day_data,
  17.   xkey: 'period',
  18.   ykeys: ['licensed', 'sorned', 'other'],
  19.   labels: ['Licensed', 'SORN', 'Other'],
  20.   /* custom label formatting with `xLabelFormat` */
  21.   xLabelFormat: function(d) { return (d.getMonth()+1)+'/'+d.getDate()+'/'+d.getFullYear(); },
  22.   /* setting `xLabels` is recommended when using xLabelFormat */
  23.   xLabels: 'day'
  24. });