From: gregor herrmann <gregor@toastfreeware.priv.at>
Date: Thu, 14 Jun 2018 21:24:58 +0000 (+0200)
Subject: aesthetic sugar: set width of charts to 80% of parent
X-Git-Url: https://git.toastfreeware.priv.at/chrisu/seepark.git/commitdiff_plain/336ac17d74ed5b34b4a2c1f8a773dbb99dacaa72

aesthetic sugar: set width of charts to 80% of parent
---

diff --git a/web/static/seepark_web.css b/web/static/seepark_web.css
index 70d7692..9113003 100644
--- a/web/static/seepark_web.css
+++ b/web/static/seepark_web.css
@@ -14,9 +14,12 @@
     fill: red;
 }
 
-#openweathermap-widget-15 {
+#openweathermap-widget-15, .c3 {
     margin: 0 auto;
     text-align: center;
     padding-top: 1em;
+}
+
+#openweathermap-widget-15 {
     width: 300px;
 }
diff --git a/web/static/seepark_web.js b/web/static/seepark_web.js
index 87e897a..399fd86 100644
--- a/web/static/seepark_web.js
+++ b/web/static/seepark_web.js
@@ -2,7 +2,10 @@ var api_base_url = '/api/1/sensor/type/Wassertemperatur?mode=consolidated&format
 
 function dayschart(element, interval, days) {
 	var chart = c3.generate({
-		bindto: element,
+		bindto: '#' + element,
+		size: {
+			width: document.getElementById(element).parentElement.clientWidth * 80 / 100
+		},
 		transition: {
 			duration: null
 		},
@@ -103,7 +106,7 @@ function beginend(days) {
 	return '&begin=' + begin + '&end=' + end;
 }
 
-dayschart('#chart1',   'Tag',     1);
-dayschart('#chart7',   'Woche',   7);
-dayschart('#chart31',  'Monat',  31);
-dayschart('#chart365', 'Jahr',  365);
+dayschart('chart1',   'Tag',     1);
+dayschart('chart7',   'Woche',   7);
+dayschart('chart31',  'Monat',  31);
+dayschart('chart365', 'Jahr',  365);