File size: 1,477 Bytes
f61d311 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<c-card class="mb-4">
<c-card-header>
<h2 class="card-title mb-0" id="forecasts">Hourly temperature forecasts for Washington D.C. for the last 30 days ({{ datesLabel }})</h2>
</c-card-header>
<c-card-body>
<c-row>
<c-col>
<horizontal-date-scroller [fromDate]="startDate" [toDate]="endDate" (dateChanged)="changeSelectedDate($event)">loading</horizontal-date-scroller>
</c-col>
</c-row>
<c-chart
[data]="mainChart.data"
[height]="300"
[ngStyle]="{ 'marginTop.px': 40 }"
[options]="mainChart.options"
[type]="mainChart.type"
[redraw]="true"
>
</c-chart>
</c-card-body>
</c-card>
<c-card>
<c-card-header>
<h2 class="card-title mb-0" id="table-title">Predicted vs Actual temperatures for {{ selectedDate }}</h2>
</c-card-header>
<c-card-body>
<table [striped]="true" cTable>
<thead>
<tr>
<th scope="col"><strong>Time</strong></th>
<th scope="col"><strong>Predicted (°F)</strong></th>
<th scope="col"><strong>Actual (°F)</strong></th>
<th scope="col"><strong>Error</strong></th>
</tr>
</thead>
<tbody>
<tr *ngFor="let row of tableRows$ | async">
<td>{{ row.time }}</td>
<td>{{ row.predicted }}</td>
<td>{{ row.actual }}</td>
<td>{{ row.error }}</td>
</tr>
</tbody>
</table>
</c-card-body>
</c-card>
|