From b71513a74b96f1c0eb589aa1875cff72d7e01237 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20B=C3=B6ckelmann?= <uqpko@student.kit.edu>
Date: Sun, 19 Nov 2023 15:36:34 +0100
Subject: [PATCH] Choose between ChartType

---
 .../taskgroup-activity.component.html                |  8 +++++++-
 .../taskgroup-activity.component.ts                  | 12 +++++++-----
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.html b/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.html
index b4d43c1..39ee84d 100644
--- a/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.html
+++ b/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.html
@@ -1,11 +1,17 @@
 <div class="container">
   <app-navigation-link-list #navLinkList [navigationLinks]="defaultNavigationLinkPath"></app-navigation-link-list>
-  <mat-form-field style="width: 100%">
+  <mat-form-field style="width: 90%">
     <mat-label>Toppings</mat-label>
     <mat-select [(ngModel)]="selectedTaskgroupPath" (ngModelChange)="updateSerieSelection()">
       <mat-option *ngFor="let topping of taskgroupPaths" [value]="topping">{{topping.taskgroupPath}}</mat-option>
     </mat-select>
   </mat-form-field>
+  <mat-form-field style="width: 10%;">
+    <mat-label>Toppings</mat-label>
+    <mat-select [(ngModel)]="selectedChartype" (ngModelChange)="updateSerieSelection()">
+      <mat-option *ngFor="let topping of availableChartTypes" [value]="topping">{{topping}}</mat-option>
+    </mat-select>
+  </mat-form-field>
 
   <div style="text-align:center">
     <apx-chart
diff --git a/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.ts b/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.ts
index 7cefd6d..caf6965 100644
--- a/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.ts
+++ b/frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.ts
@@ -7,7 +7,7 @@ import {
   ApexAxisChartSeries,
   ApexChart,
   ApexXAxis,
-  ApexTitleSubtitle
+  ApexTitleSubtitle, ChartType
 } from "ng-apexcharts";
 import {timeInterval} from "rxjs";
 import {FormControl} from "@angular/forms";
@@ -41,7 +41,8 @@ export class TaskgroupActivityComponent implements OnInit{
   ];
 
 
-
+  selectedChartype: string = "bar";
+  availableChartTypes: string[] = ["bar", "line", "area"]
   selectedTaskgroupPath: TaskgroupPathInfo | undefined
   taskgroupPaths: TaskgroupPathInfo[] = []
   sliderControl: FormControl = new FormControl()
@@ -109,12 +110,13 @@ export class TaskgroupActivityComponent implements OnInit{
   }
 
   generateChartOptions(): Partial<ChartOptions> {
+
     return {
       series: this.generateSeries(),
         chart: {
-      height: 350,
-        type: "bar",
-        stacked: false
+          height: 350,
+          type: this.selectedChartype as ChartType,
+          stacked: true
     },
       title: {
         text: ""