ztimson/homefront
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

More styling

Browse Source
This commit is contained in:
Zakary Timson
2018-11-15 13:24:12 -05:00
parent edfdad1547
commit 070eeae55e
5 changed files with 27 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/app/battery/battery.component.html
View File

@ -1,26 +1,23 @@
<div class="nav-fix"></div>
<h1>POWER WALL:
<span *ngIf="batteryService.batteries.length" class="text-muted">{{batteryService.average * 100}}%</span>
<span *ngIf="!batteryService.batteries.length" class="text-muted">UNKNOWN</span>
</h1>
<div class="d-flex flex-column flex-md-row mb-3">
<div style="overflow: auto">
<ngx-charts-bar-vertical
<div class="flex-grow-1 flex-basis-0" style="overflow: hidden; height: 400px">
<ngx-charts-bar-vertical #chart1
[results]="batteryService.percentageData"
[scheme]="airScheme"
[view]="[400, 200]"
[xAxis]="true"
[yAxis]="true"
[yScaleMin]="0"
[yScaleMax]="100"
></ngx-charts-bar-vertical>
</div>
<div style="overflow: auto">
<ngx-charts-bar-vertical
<div class="flex-grow-1 flex-basis-0" style="overflow: hidden; height: 400px">
<ngx-charts-bar-vertical #chart2
[results]="batteryService.temperatureData"
[scheme]="fireScheme"
schemeType="linear"
[view]="[400, 200]"
[xAxis]="true"
[yAxis]="true"
[yScaleMin]="0"
@ -29,7 +26,7 @@
</div>
</div>
<mat-card *ngFor="let b of batteryService.batteries" class="mb-3">
<h3>{{b.name}}</h3>
<h5>{{b.name}}</h5>
{{b.history[0].percentage * 100}}%
<br>
{{round(b.history[0].temp)}} °C

14
src/app/battery/battery.component.ts
View File

@ -1,11 +1,14 @@
import {Component} from '@angular/core';
import {Component, OnInit, ViewChild} from '@angular/core';
import {BatteryService} from './battery.service';
import {BarVerticalComponent} from '@swimlane/ngx-charts/release/bar-chart';
@Component({
selector: 'app-batterys',
templateUrl: './battery.component.html'
})
export class BatteryComponent {
export class BatteryComponent implements OnInit {
@ViewChild('chart1') chart1: BarVerticalComponent;
@ViewChild('chart2') chart2: BarVerticalComponent;
airScheme = {
name: 'air',
@ -23,6 +26,13 @@ export class BatteryComponent {
constructor(public batteryService: BatteryService) { }
ngOnInit() {
setTimeout(() => {
this.chart1.update();
this.chart2.update();
}, 1000);
}
round(num: number) {
return Math.round(num * 10) / 10;
}