Initial commit

2015-03-22 09:16:26 -04:00
parent c7b1125cb1
commit 6338c528e9
12 changed files with 581 additions and 5 deletions
--- a/delay.html
+++ b/delay.html
@@ -0,0 +1,123 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <title>Stat delay</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.5.0/bootstrap-table.min.css">
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+  <script src="http://code.highcharts.com/highcharts.js"></script>
+<script src="http://code.highcharts.com/modules/exporting.js"></script>
+<script type="text/javascript">
+$(function () {
+	console.log('load');
+	var seriesOptions = [];
+	var createChart = function(){
+		console.log('create');
+    	$('#container').highcharts({
+        chart: {
+            type: 'scatter',
+            zoomType: 'xy'
+        },
+        title: {
+            text: 'Time to heat or cool vs outside temperature'
+        },
+        subtitle: {
+            text: 'Because science'
+        },
+        xAxis: {
+            title: {
+                enabled: true,
+                text: 'Minutes per degree change'
+            },
+            startOnTick: true,
+            endOnTick: true,
+            showLastLabel: true
+        },
+        yAxis: {
+            title: {
+                text: 'Outside temp'
+            }
+        },
+        legend: {
+            layout: 'vertical',
+            align: 'left',
+            verticalAlign: 'top',
+            x: 100,
+            y: 70,
+            floating: true,
+            backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF',
+            borderWidth: 1
+        },
+        plotOptions: {
+            scatter: {
+                marker: {
+                    radius: 5,
+                    states: {
+                        hover: {
+                            enabled: true,
+                            lineColor: 'rgb(100,100,100)'
+                        }
+                    }
+                },
+                states: {
+                    hover: {
+                        marker: {
+                            enabled: false
+                        }
+                    }
+                },
+                tooltip: {
+                    headerFormat: '<b>{series.name}</b><br>',
+                    pointFormat: '{point.x} min per degree, {point.y} degrees'
+                }
+            }
+        },
+        series: seriesOptions,
+        
+    });
+    }
+    $.getJSON('delay.php', function (data) {
+    	console.log("data");
+								seriesOptions[0] = {
+										name: "Heat, Heating",
+										data: data[0]
+								};
+								seriesOptions[1] = {
+										name: "Heat, down",
+										data: data[1]
+								};
+								
+								createChart();
+							
+						
+						});
+});
+
+</script>
+
+
+<body>
+  <!-- Fixed navbar -->
+    <nav class="navbar navbar-inverse">
+      <div class="container">
+        <div class="navbar-header">
+          <a class="navbar-brand" href="#">Stat stats</a>
+        </div>
+        <div id="navbar" class="navbar-collapse collapse">
+          <ul class="nav navbar-nav">
+            <li><a href="index.html">Home</a></li>
+            <li><a href="graph.html">Graph</a></li>
+            <li class="active"><a href="delay.html">Delay</a></li>
+          </ul>
+        </div><!--/.nav-collapse -->
+      </div>
+    </nav>
+<div id="container" style="min-width: 310px; height: 400px; max-width: 800px; margin: 0 auto"></div>
+
+
+
+</body></html>