add buttons for day/week/month/year, + css and a js function
authorgregor herrmann <gregor@toastfreeware.priv.at>
Mon, 4 Jun 2018 19:46:16 +0000 (21:46 +0200)
committergregor herrmann <gregor@toastfreeware.priv.at>
Mon, 4 Jun 2018 19:46:16 +0000 (21:46 +0200)
web/static/seepark_web.css
web/static/seepark_web.js
web/templates/seepark_web.html

index d48e83871f71be9f8405b15cb4fc507b3a41b96b..5cf1aadaffaf060caa37fd38d87cf631e95d13bf 100644 (file)
 .region-boiling {
     fill: red;
 }
+
+button {
+    color: inherit;
+    font: inherit;
+    margin: 0;
+    border: 1px solid;
+}
+
+#buttonbar {
+    margin: 0 auto;
+    text-align: center;
+    padding-top: 1em;
+}
index eedcb44b51de04ba48d21dcbeda7a9722de216a7..73e9ac2f4492bd165f22fd539f929214fdea180f 100644 (file)
@@ -84,3 +84,9 @@ var chart = c3.generate({
        ]
 });
 
+function loaddays(days) {
+       chart.load({
+               url: '/data/' + days,
+               mimeType: 'json'
+       });
+}
index b19635a3df05a9cf16d42ce90c5ac3ded550c569..746e9a5ce5cd8e134e4233d1a78b5537bd827fb3 100644 (file)
        <body>
                <h1>Daten zum Seepark Obsteig</h1>
                <div id="chart"></div>
+               <div id="buttonbar">
+                       <button onclick="loaddays(1)">Tag</button>
+                       <button onclick="loaddays(7)">Woche</button>
+                       <button onclick="loaddays(30)">Monat</button>
+                       <button onclick="loaddays(365)">Jahr</button>
+               </div>
 
                <!-- Load own javascript code -->
                <script src="{{url_for('static', filename='seepark_web.js')}}"></script>