Commit bb94aa66 authored by Matthieu Benoist's avatar Matthieu Benoist
Browse files

Add annotation plugin to chart.js. Create a grey background with annotation box.

parent 3ef63560
......@@ -6315,6 +6315,14 @@
"color-name": "^1.0.0"
}
},
"chartjs-plugin-annotation": {
"version": "0.5.7",
"resolved": "https://registry.npmjs.org/chartjs-plugin-annotation/-/chartjs-plugin-annotation-0.5.7.tgz",
"integrity": "sha1-G/DjAZmmqf+Yic4PN6HnVagNEL8=",
"requires": {
"chart.js": "^2.4.0"
}
},
"check-types": {
"version": "8.0.3",
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
......
import { Component, Input, OnInit } from '@angular/core';
import { Chart } from 'chart.js';
import * as ChartAnnotation from 'chartjs-plugin-annotation';
import { datasetStatistics } from '../../../../../i18n/traductions';
@Component({
......@@ -17,6 +18,10 @@ export class InfoChartComponent implements OnInit {
barWidth = 20;
ngOnInit(): void {
let namedChartAnnotation = ChartAnnotation;
namedChartAnnotation["id"]="annotation";
Chart.pluginService.register( namedChartAnnotation);
this.chart = new Chart('myChart', {
type: 'bar',
data: {
......@@ -102,14 +107,15 @@ export class InfoChartComponent implements OnInit {
display: false
},
annotation: {
drawTime: 'beforeDatasetsDraw',
annotations: [{
type: 'box',
yScaleID: 'y-axis-0',
yMin: 1,
yMax: 2000000,
xScaleID: 'x-axis-0',
xMin: -1,
xMax: 12,
borderColor: 'rgb(242,242,242)',
borderWidth:2,
backgroundColor: 'rgb(242,242,242)',
backgroundColor: 'rgba(121,121,121,0.10 )',
}]
},
scales: {
......
......@@ -69,7 +69,6 @@ export class UsageStatisticsService {
for (let i = 0; i < 12; i += 1) {
dates.push(`${today.getFullYear()}-${`0${today.getMonth() + 1}`.slice(-2)}-01`);
today.setMonth(today.getMonth() - 1);
console.log(today.getMonth());
}
return dates.reverse();
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment