From a78e01a68ba803997a02e3037f7427ffafe41ab0 Mon Sep 17 00:00:00 2001
From: Daniel Shinji <danielst@usp.br>
Date: Wed, 19 Jun 2024 22:53:28 -0300
Subject: [PATCH] Add chart

---
 .../core/test-page/test-page.component.html   |  1 -
 src/app/core/test-page/test-page.component.ts |  3 +
 src/app/models/chart.model.ts                 |  6 +-
 src/app/shared/chart/chart.component.html     |  1 +
 src/app/shared/chart/chart.component.ts       | 55 ++++++++++---------
 5 files changed, 37 insertions(+), 29 deletions(-)

diff --git a/src/app/core/test-page/test-page.component.html b/src/app/core/test-page/test-page.component.html
index f7aca56..69ed446 100644
--- a/src/app/core/test-page/test-page.component.html
+++ b/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>
\ No newline at end of file
diff --git a/src/app/core/test-page/test-page.component.ts b/src/app/core/test-page/test-page.component.ts
index e5e0fff..7521216 100644
--- a/src/app/core/test-page/test-page.component.ts
+++ b/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;
diff --git a/src/app/models/chart.model.ts b/src/app/models/chart.model.ts
index 96b6b34..bc6a36a 100644
--- a/src/app/models/chart.model.ts
+++ b/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
 }
\ No newline at end of file
diff --git a/src/app/shared/chart/chart.component.html b/src/app/shared/chart/chart.component.html
index e69de29..c40b4ef 100644
--- a/src/app/shared/chart/chart.component.html
+++ b/src/app/shared/chart/chart.component.html
@@ -0,0 +1 @@
+<app-bar-chart></app-bar-chart> 
\ No newline at end of file
diff --git a/src/app/shared/chart/chart.component.ts b/src/app/shared/chart/chart.component.ts
index 937928a..bb872dd 100644
--- a/src/app/shared/chart/chart.component.ts
+++ b/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
+      }
+    });
+  }
 
 }