Last-minute changes for the demo, such as making a seperate page for …

…the crazy css demo
palantir · Feb 4, 2014 · 7baf7a7 · 7baf7a7
1 parent c0f7d1a
commit 7baf7a7
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 46 deletions.
diff --git a/examples/demo-day-crazy.css b/examples/demo-day-crazy.css
@@ -27,3 +27,8 @@ circle {
 .selected-point {
   fill: black;
 }
+
+.drag-box {
+  fill: red;
+  opacity: 0.5;
+}
diff --git a/examples/demo-day-crazy.html b/examples/demo-day-crazy.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<head>
+  <link href="../style.css" type="text/css" rel="stylesheet" />
+  <link href="demo-day-crazy.css" type="text/css" rel="stylesheet" />
+</head>
+<body>
+<br><hr><br>
+<svg id="table" width="800px" height="600px"></svg>
+<br><hr><br>
+
+
+<script type="text/javascript"> window.demoName = "demo-day"; //HACK HACK </script>
+<script src="../Lib/chai/chai.js"></script>
+<script src="../Lib/lodash.js"></script>
+<script src="../Lib/d3.ascii.js"></script>
+<script src="../plottable.js"></script>
+<script src="examples.js"></script>
+
+</body>
diff --git a/examples/demoDay.ts b/examples/demoDay.ts
@@ -9,10 +9,6 @@
 ///<reference path="exampleUtil.ts" />
 
 if ((<any> window).demoName === "demo-day") {
-
-// First we make the scatterplot that shows the full dataset
-
-
 var N_BINS = 25;
 function makeScatterPlotWithSparkline(data) {
   var s: any = {};
@@ -88,46 +84,6 @@ function makeScatterHisto(data) {
   return {table: table, s: s, h: h};
 }
 
-function filterSelectedData(data) {
-  var p = (d) => d.selected;
-  return data.filter(p);
-}
-
-function makeBinFunction(accessor, range, nBins) {
-  return (d) => binByVal(d, accessor, range, nBins);
-}
-
-function binByVal(data: any[], accessor: IAccessor, range=[0,100], nBins=10) {
-  if (accessor == null) {accessor = (d) => d.x};
-  var min = range[0];
-  var max = range[1];
-  var spread = max-min;
-  var binBeginnings = _.range(nBins).map((n) => min + n * spread / nBins);
-  var binEndings = _.range(nBins)   .map((n) => min + (n+1) * spread / nBins);
-  var counts = new Array(nBins);
-  _.range(nBins).forEach((b, i) => counts[i] = 0);
-  data.forEach((d) => {
-    var v = accessor(d);
-    var found = false;
-    for (var i=0; i<nBins; i++) {
-      if (v <= binEndings[i]) {
-        counts[i]++;
-        found = true;
-        break;
-      }
-    }
-    if (!found) {counts[counts.length-1]++};
-  });
-  var bins = counts.map((count, i) => {
-    var bin: any = {};
-    bin.x = binBeginnings[i];
-    bin.x2 = binEndings[i];
-    bin.y = count;
-    return bin;
-  })
-  return bins;
-}
-
 function coordinator(chart: any, dataset: IDataset) {
   var scatterplot = chart.s;
   var histogram = chart.h;
@@ -164,7 +120,6 @@ function coordinator(chart: any, dataset: IDataset) {
 function grabIndices(itemsToGrab: any[], indices: number[]) {
   return indices.map((i) => itemsToGrab[i]);
 }
-
 var clump1 = makeNormallyDistributedData(300, -10, 5, 7, 1);
 var clump2 = makeNormallyDistributedData(300, 2, 0.5, 3, 3);
 var clump3 = makeNormallyDistributedData(30, 5, 10, -3, 9);

diff --git a/examples/exampleUtil.ts b/examples/exampleUtil.ts
@@ -19,7 +19,40 @@ function makeNormallyDistributedData(n=100, xMean?, xStdDev?, yMean?, yStdDev?)
   }
   return results;
 }
+function makeBinFunction(accessor, range, nBins) {
+  return (d) => binByVal(d, accessor, range, nBins);
+}
 
+function binByVal(data: any[], accessor: IAccessor, range=[0,100], nBins=10) {
+  if (accessor == null) {accessor = (d) => d.x};
+  var min = range[0];
+  var max = range[1];
+  var spread = max-min;
+  var binBeginnings = _.range(nBins).map((n) => min + n * spread / nBins);
+  var binEndings = _.range(nBins)   .map((n) => min + (n+1) * spread / nBins);
+  var counts = new Array(nBins);
+  _.range(nBins).forEach((b, i) => counts[i] = 0);
+  data.forEach((d) => {
+    var v = accessor(d);
+    var found = false;
+    for (var i=0; i<nBins; i++) {
+      if (v <= binEndings[i]) {
+        counts[i]++;
+        found = true;
+        break;
+      }
+    }
+    if (!found) {counts[counts.length-1]++};
+  });
+  var bins = counts.map((count, i) => {
+    var bin: any = {};
+    bin.x = binBeginnings[i];
+    bin.x2 = binEndings[i];
+    bin.y = count;
+    return bin;
+  })
+  return bins;
+}
 function makeRandomBucketData(numBuckets: number, bucketWidth: number, maxValue = 10): IDataset {
   var data = [];
   for (var i=0; i < numBuckets; i++) {

diff --git a/index.html b/index.html
@@ -12,6 +12,7 @@ <h1><a href="tests.html">Tests</a></h1>
 <h1><a href="examples/demo1.html">The old demo</a></h1>
 <h1><a href="examples/sparkline-demo.html">Sparkline demo</a></h1>
 <h1><a href="examples/demo-day.html">Demo Day</a></h1>
-<h1><a href="examples/tsc-demo.html">TSC Demo</a></h1>
+<h1><a href="examples/demo-day-crazy.html">Demo Day With Crazy CSS</a></h1>
+<h1><a href="examples/tsc-demo.html">TSC Demo</a></h1> <a href="examples/tscDemo.ts">(the code)</a>
 
 </body>