refactor to use array of objects to map state data to chart update

This commit is contained in:
Jesse Lucas 2020-03-24 13:18:01 -04:00
parent 598dc991e8
commit f342a2a54b
2 changed files with 21 additions and 12 deletions

View File

@ -4,7 +4,7 @@
<div fxLayout="row" fxLayoutAlign="space-between start">
<app-donut-chart [elementID]="chartID"></app-donut-chart>
<div class="items" fxLayout="column" fxLayoutAlign="space-evenly end">
<app-chart-item *ngFor="let state of states | keyvalue" [state]="state.key" [count]="state.value">
<app-chart-item *ngFor="let state of states" [state]="state.label" [count]="state.count">
</app-chart-item>
</div>
</div>

View File

@ -12,11 +12,11 @@ import { DonutChartComponent } from '../donut-chart/donut-chart.component';
export class FolderChartComponent implements OnInit {
@ViewChild(DonutChartComponent) donutChart: DonutChartComponent;
chartID: string = 'foldersChart';
states: Map<string, number>;
states: { label: string, count: number }[];
elevation: string = cardElevation;
constructor(private folderService: FolderService) {
this.states = new Map();
this.states = [];
}
ngOnInit(): void {
@ -28,19 +28,28 @@ export class FolderChartComponent implements OnInit {
ngAfterViewInit() {
this.folderService.getAll().subscribe(
folder => {
// TODO: Clear existing data
this.donutChart.data([40]);
// Get StateType and convert to string
const stateType: Folder.StateType = Folder.getStateType(folder);
const state: string = Folder.stateTypeToString(stateType);
// Instantiate empty count states
if (!this.states.has(state)) {
this.states.set(state, 0);
// Check if state exists
let found: boolean = false;
this.states.forEach(s => {
if (s.label === state) {
s.count = s.count + 1;
found = true;
console.log("increase count", s.count);
}
const count: number = this.states.get(state) + 1;
this.states.set(state, count);
});
if (!found) {
this.states.push({ label: state, count: 1 });
}
this.donutChart.updateData(this.states);
},
err => console.error('Observer got an error: ' + err),
() => {
}
);
}