Add chart

src/app/core/test-page/test-page.component.html

@@ -29,4 +29,3 @@
     <app-image-grid [gridItems]="exemplosPhotos" [large]="true"></app-image-grid>
 
     <app-image-grid [gridItems]="modalExemplo"></app-image-grid>
-</section>

src/app/core/test-page/test-page.component.ts

@@ -12,6 +12,8 @@ import { environment } from '../../../environments/environment'
  /* MQTT FINAL */
 import { MongoClient } from 'mongodb';
 
+import { Chart } from 'chart.js';
+
 @Component({
   selector: 'app-test-page',
   templateUrl: './test-page.component.html',
@@ -74,6 +76,7 @@ export class TestPageComponent {
   ]
 
 
+
  /* MQTT */
   constructor(private _mqttService: MqttService) {
     this.client = this._mqttService;

src/app/models/chart.model.ts

@@ -1,6 +1,6 @@
 export interface ChartModel {
-  name: string
+  label?: string
+  labels?: Float32Array
   data?: Float32Array
-  categories?: Float32Array
-  text: string
+  titleC?: string
 }

src/app/shared/chart/chart.component.html

@@ -0,0 +1 @@
+<app-bar-chart></app-bar-chart> 

src/app/shared/chart/chart.component.ts

@@ -1,38 +1,43 @@
-import { Component, OnInit, Input } from '@angular/core';
-import {
-  ChartComponent,
-  ApexAxisChartSeries,
-  ApexChart,
-  ApexXAxis,
-  ApexDataLabels,
-  ApexTitleSubtitle,
-  ApexStroke,
-  ApexGrid
-} from "ng-apexcharts";
-
-export type ChartOptions = {
-  series: ApexAxisChartSeries;
-  chart: ApexChart;
-  xaxis: ApexXAxis;
-  dataLabels: ApexDataLabels;
-  grid: ApexGrid;
-  stroke: ApexStroke;
-  title: ApexTitleSubtitle;
-};
+import { Component, Input, OnInit } from '@angular/core';
+import { Chart } from 'chart.js';
 
 @Component({
   selector: 'app-chart',
   templateUrl: './chart.component.html',
 })
 
-export class ChartsComponent implements OnInit {
-  @Input() name!: string
+
+
+export class ChartComponent implements OnInit {
+  @Input() label?: string
+  @Input() labels?: Float32Array
   @Input() data?: Float32Array
-  @Input() categories?: Float32Array
-  @Input() text!: string
+
+  public chart: any;
 
   ngOnInit(): void {
+    this.createChart();
   }
 
+  createChart(){
+
+    this.chart = new Chart("MyChart", {
+      type: 'line',
+
+      data: {
+        labels: [], 
+	       datasets: [
+          {
+            label: '',
+            data: [],
+            backgroundColor: 'blue'
+          },
+       ]
+      },
+      options: {
+        aspectRatio:2.5
+      }
+    });
+  }
 
 }