Added some colors
This commit is contained in:
parent
eda5fa93a3
commit
deb5251b5a
@ -5,7 +5,8 @@
|
||||
<small *ngIf="timer" class="text-muted">{{timer}} microseconds to upload</small>
|
||||
<span class="mx-auto"><!-- Spacer --></span>
|
||||
<mat-chip-list class="mr-2">
|
||||
<mat-chip *ngFor="let file of fileNames" color="primary" [removable]="true" (removed)="remove($event.chip.value)" [value]="file">
|
||||
<mat-chip *ngFor="let file of fileNames; let i = index" class="text-white" [style.backgroundColor]="colorScheme.domain[i]"
|
||||
[removable]="true" (removed)="remove($event.chip.value)" [value]="file">
|
||||
{{file}}
|
||||
<mat-icon matChipRemove>cancel</mat-icon>
|
||||
</mat-chip>
|
||||
@ -19,10 +20,11 @@
|
||||
<img *ngIf="!chartResults" class="float-right mt-2 mr-5" src="assets/starthere.png">
|
||||
<div *ngIf="chartResults" class="w-100" [style.height]="chartHeight">
|
||||
<ngx-charts-bar-horizontal-2d #chart
|
||||
[results]="chartResults"
|
||||
[xAxis]="true"
|
||||
[yAxis]="true"
|
||||
[xAxisTickFormatting]="format">
|
||||
[scheme]="colorScheme"
|
||||
[results]="chartResults"
|
||||
[xAxis]="true"
|
||||
[yAxis]="true"
|
||||
[xAxisTickFormatting]="format">
|
||||
</ngx-charts-bar-horizontal-2d>
|
||||
</div>
|
||||
<input #fileUploader type="file" accept="text/csv" multiple hidden (change)="upload(fileUploader.files)">
|
||||
|
@ -1,11 +1,13 @@
|
||||
import {Component} from '@angular/core';
|
||||
import {timer} from './timer';
|
||||
import {colorScheme} from './colorScheme';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
templateUrl: './app.component.html'
|
||||
})
|
||||
export class AppComponent {
|
||||
colorScheme = colorScheme; // colors
|
||||
chartResults; // This is where the chart reads the data from
|
||||
chartHeight = '100%'; // Dynamic height for chart
|
||||
timer = window['timer']; // Async pipe to display the timed data
|
||||
|
6
src/app/colorScheme.ts
Normal file
6
src/app/colorScheme.ts
Normal file
@ -0,0 +1,6 @@
|
||||
export const colorScheme = {
|
||||
name: 'cool',
|
||||
selectable: true,
|
||||
group: 'Ordinal',
|
||||
domain: ['#a8385d', '#7aa3e5', '#a27ea8', '#aae3f5', '#adcded', '#a95963', '#8796c0', '#7ed3ed', '#50abcc', '#ad6886']
|
||||
};
|
Loading…
Reference in New Issue
Block a user