D3.js London May

First cut of streaming graph library and presentation for the D3.js London User Group
herebebeasties · May 8, 2013 · 2f5669c · 2f5669c
commit 2f5669c
Show file tree

Hide file tree

Showing 24 changed files with 1,723 additions and 0 deletions.
diff --git a/.gitmodules b/.gitmodules
@@ -0,0 +1,9 @@
+[submodule "d3"]
+	path = d3
+	url = https://github.com/mbostock/d3.git
+[submodule "reveal.js"]
+	path = reveal.js
+	url = https://github.com/hakimel/reveal.js.git
+[submodule "tornado"]
+	path = tornado
+	url = https://github.com/facebook/tornado.git
diff --git a/2013-05-09.RealtimeTimeseriesVisualisation/demo-black.css b/2013-05-09.RealtimeTimeseriesVisualisation/demo-black.css
@@ -0,0 +1,39 @@
+svg {
+	font-size: 16px;
+}
+
+svg > .error {
+	background: #fee0;
+}
+
+.line {
+	fill: none;
+	stroke: #fff;
+	stroke-width: 1.5px;
+}
+
+.line.error {
+	stroke: #f88;
+	stroke-width: 3px;
+}
+
+.grid .tick {
+	stroke: #ccc;
+	stroke-width: 1px;
+	stroke-opacity: 0.25;
+	shape-rendering: crispEdges;
+}
+
+.grid path {
+	stroke-width: 0;
+}
+
+.axis path, .axis line {
+	fill: none;
+	stroke: #888;
+	shape-rendering: crispEdges;
+}
+
+.axis text {
+	fill: #ccc;
+}
diff --git a/2013-05-09.RealtimeTimeseriesVisualisation/demo.css b/2013-05-09.RealtimeTimeseriesVisualisation/demo.css
@@ -0,0 +1,43 @@
+svg {
+	font-size: 9px;
+}
+
+svg > .error {
+	background: #fee0;
+}
+
+div.slides svg {
+	zoom: 1 !important;
+}
+
+.line {
+	fill: none;
+	stroke: #000;
+	stroke-width: 1.5px;
+}
+
+.line.error {
+	stroke: #f00;
+	stroke-width: 3px;
+}
+
+.grid .tick {
+	stroke: #ccc;
+	stroke-width: 1px;
+	stroke-opacity: 0.25;
+	shape-rendering: crispEdges;
+}
+
+.grid path {
+	stroke-width: 0;
+}
+
+.axis path, .axis line {
+	fill: none;
+	stroke: #888;
+	shape-rendering: crispEdges;
+}
+
+.axis text {
+	fill: #888;
+}
diff --git a/2013-05-09.RealtimeTimeseriesVisualisation/demo.html b/2013-05-09.RealtimeTimeseriesVisualisation/demo.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<html>
+<head>
+	<script src="../d3/d3.js" charset="utf-8"></script>
+	<script src="websocket.js"></script>
+	<script src="streaming_graph.js"></script>
+	<link rel="stylesheet" href="demo.css" />
+</head>
+<body>
+	<svg height="120" width="98%" id="g1"/>
+	<script>
+		var graph = new StreamingGraph('#g1', 60000, 750, 20);
+	</script>
+</body>
+</html>
diff --git a/2013-05-09.RealtimeTimeseriesVisualisation/html5-logo.svg b/2013-05-09.RealtimeTimeseriesVisualisation/html5-logo.svg