<span *ngIf="loaded">

	<div class="col-md-12">
		<h2>{{name}}</h2>
	</div>

	<div class="col-md-12">
		<div class="well">
			<b>Huidig opgenomen vermogen:</b> {{hov}} kW <br>
			<b>Huidig teruggeleverd vermogen:</b> {{htv}} kW <br>
			<b>Huidig tarief:</b> {{ht}} <br>
			<b>Totale kosten:</b> €{{money}}
		</div>
	</div>


	<div class="col-md-6">
		<div style="display: block;">
			<canvas baseChart width="400" height="400"
		            [datasets]="data1.data"
		            [labels]="label.data"
		            [options]="lineChartOptions"
		            [colors]="lineChartColors"
		            [legend]="lineChartLegend"
		            [chartType]="lineChartType"></canvas>
		</div>
	</div>

	<div class="col-md-6">
		<line-chart [label]="label" [data]="data2"></line-chart>
	</div>

	<div class="col-md-6">
		<line-chart [label]="label" [data]="data3"></line-chart>
	</div>

	<div class="col-md-6">
		<line-chart [label]="label" [data]="data4"></line-chart>
	</div>

</span>
