angular - How to create a bar chart with several bars between each time label (ng2-chart) -

i trying create chart time labels , more data points labels. here test chart trying display:

html:

 <div>   <div style="display: block; width: 600px">     <canvas basechart             [datasets]="barchartdata"             [labels]="barchartlabels"             [options]="barchartoptions"             [legend]="barchartlegend"             [charttype]="barcharttype"             (charthover)="charthovered($event)"             (chartclick)="chartclicked($event)"></canvas>   </div> </div> 

js:

import { component } '@angular/core';  @component({     selector: 'test-chart',     templateurl: './test-chart-component.html' })  export class testchartcomponent {     public barchartoptions:any = {         scaleshowverticallines: false,         responsive: true,          scales: {             xaxes: [{                 type: 'time',                 time: {                     round: 'year',                    unit: 'year',                     min: new date('2006'),                     max: new date('2012')                 }             }]         }      };     public barchartlabels: date[] = [         new date('01/2006'), new date('06-2006'),         new date('01/2007'), new date('06-2007'),         new date('01/2008'), new date('06-2008'),         new date('01/2009'), new date('06-2009'),         new date('01/2010'), new date('06-2010'),         new date('01/2011'), new date('06-2011'),         new date('01/2012'), new date('06-2012')     ];     public barcharttype:string = 'line';     public barchartlegend:boolean = true;      public barchartdata:any[] = [         {data: [65, 70, 80, 30, 62, 81, 59, 80, 81, 56, 55, 40, 20, 12], label: 'test'},     ];      // events     public chartclicked(e:any):void {         console.log(e);     }      public charthovered(e:any):void {         console.log(e);     } } 

dependencies :

"@angular/common": "~2.4.0", "@angular/compiler": "~2.4.0", "@angular/core": "~2.4.0", "@angular/forms": "~2.4.0", "@angular/http": "~2.4.0", "@angular/platform-browser": "~2.4.0", "@angular/platform-browser-dynamic": "~2.4.0", "@angular/router": "~3.4.0", "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.20", "angular2-moment": "^1.3.3", "chart.js": "^2.5.0", "core-js": "^2.4.1", "express": "^4.0", "ng2-charts": "^1.5.0", "rxjs": "5.0.1", "zone.js": "^0.7.4" 

in example, want 2 bars per year on time range between 2006 , 2012. don't errors bars not being displayed. have been reading doc on http://www.chartjs.org/docs/ , can't make sense out of it.