ztimson/etf-demo
ztimson/etf-demo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases 1 Activity

Added some colors

Browse Source
This commit is contained in:
Zakary Timson 2018-11-29 20:25:41 -05:00
parent eda5fa93a3
commit deb5251b5a
3 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/app.component.html
View File

@ -5,7 +5,8 @@
<small *ngIf="timer" class="text-muted">{{timer}} microseconds to upload</small> <small *ngIf="timer" class="text-muted">{{timer}} microseconds to upload</small>
<span class="mx-auto"><!-- Spacer --></span> <span class="mx-auto"><!-- Spacer --></span>
<mat-chip-list class="mr-2"> <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}} {{file}}
<mat-icon matChipRemove>cancel</mat-icon> <mat-icon matChipRemove>cancel</mat-icon>
</mat-chip> </mat-chip>
@ -19,10 +20,11 @@
<img *ngIf="!chartResults" class="float-right mt-2 mr-5" src="assets/starthere.png"> <img *ngIf="!chartResults" class="float-right mt-2 mr-5" src="assets/starthere.png">
<div *ngIf="chartResults" class="w-100" [style.height]="chartHeight"> <div *ngIf="chartResults" class="w-100" [style.height]="chartHeight">
<ngx-charts-bar-horizontal-2d #chart <ngx-charts-bar-horizontal-2d #chart
[results]="chartResults" [scheme]="colorScheme"
[xAxis]="true" [results]="chartResults"
[yAxis]="true" [xAxis]="true"
[xAxisTickFormatting]="format"> [yAxis]="true"
[xAxisTickFormatting]="format">
</ngx-charts-bar-horizontal-2d> </ngx-charts-bar-horizontal-2d>
</div> </div>
<input #fileUploader type="file" accept="text/csv" multiple hidden (change)="upload(fileUploader.files)"> <input #fileUploader type="file" accept="text/csv" multiple hidden (change)="upload(fileUploader.files)">

2
src/app/app.component.ts
View File

@ -1,11 +1,13 @@
import {Component} from '@angular/core'; import {Component} from '@angular/core';
import {timer} from './timer'; import {timer} from './timer';
import {colorScheme} from './colorScheme';
@Component({ @Component({
selector: 'app-root', selector: 'app-root',
templateUrl: './app.component.html' templateUrl: './app.component.html'
}) })
export class AppComponent { export class AppComponent {
colorScheme = colorScheme; // colors
chartResults; // This is where the chart reads the data from chartResults; // This is where the chart reads the data from
chartHeight = '100%'; // Dynamic height for chart chartHeight = '100%'; // Dynamic height for chart
timer = window['timer']; // Async pipe to display the timed data timer = window['timer']; // Async pipe to display the timed data

6
src/app/colorScheme.ts Normal file
View 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']
};