Commits

Sumin Byeon committed f80a0a7

Added plot.html

Comments (0)

Files changed (2)

+<html>
+  <head>
+    <title>Scatterplot</title>
+    <link type="text/css" rel="stylesheet" href="ex.css?3.2"/>
+    <script type="text/javascript" src="http://vis.stanford.edu/protovis/protovis-r3.2.js"></script>
+    <script type="text/javascript" src="data.js"></script>
+    <style type="text/css">
+
+#fig {
+  width: 430px;
+  height: 425px;
+}
+
+    </style>
+  </head>
+  <body><div id="center"><div id="fig">
+    <script type="text/javascript+protovis">
+    
+    var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+    var dots = data
+    .filter(function(d) { return d.timestamp.match(/\d+\/\d+\/\d+ \d+:\d+:\d+/) })
+    .map(function(d) {
+        var t = new Date(Date.parse(d.timestamp));
+        console.log(t.getDay(), t.getHours(), d.amount);
+            
+        return {'x':t.getHours(), 'y':t.getDay(), 'z':Math.abs(d.amount)};
+    });
+    
+    console.log(dots);
+    
+    /* Sizing and scales. */
+    var w = 600,
+        h = 400,
+        x = pv.Scale.linear(0, 24).range(0, w),
+        y = pv.Scale.linear(0, 6).range(0, h),
+        c = pv.Scale.log(1, 2000).range("orange", "brown");
+    
+    /* The root panel. */
+    var vis = new pv.Panel()
+        .width(w)
+        .height(h)
+        .bottom(20)
+        .left(25)
+        .right(10)
+        .top(10);
+    
+    /* Y-axis and ticks: Day of a week Sun-Sat */
+    vis.add(pv.Rule)
+        .data(y.ticks())
+        .bottom(y)
+        .strokeStyle(function(d) d ? "#eee" : "#000")
+        .anchor("left").add(pv.Label)
+        //.visible(function(d) d > 0 && d < 1)
+        .text(function(d) days[d]);
+    
+    /* X-axis and ticks: Time of a day 0-23 */
+    vis.add(pv.Rule)
+        .data(x.ticks())
+        .left(x)
+        .strokeStyle(function(d) d ? "#eee" : "#000")
+        .anchor("bottom").add(pv.Label)
+        .visible(function(d) d > 0 && d < 100)
+        .text(x.tickFormat);
+    
+    /* The dot plot! */
+    vis.add(pv.Panel)
+        .data(dots)
+        .add(pv.Dot)
+        .left(function(d) x(d.x))
+        .bottom(function(d) y(d.y))
+        .strokeStyle(function(d) c(d.z))
+        .fillStyle(function() this.strokeStyle().alpha(.2))
+        .size(function(d) d.z/2+10)
+        .title(function(d) d.z.toFixed(1));
+    
+    vis.render();
+
+    </script>
+  </div></div></body>
+</html>
     else:
         return None
 
-def process_row(row):
-    geo = get_geolocation(row[5])
-    return {'category':row[2], 'amount':row[3], 'lat':geo['lat'], 'lng':geo['lng']}
-
 rows = csv.reader(sys.stdin)
 #filtered = filter(lambda r: len(r) > 5 and r[5] != None, rows)
 #address_pairs = map(lambda r: (r, get_geolocation(r[5])), filtered)
         sys.stderr.write('Looking up %s...\n' % row[5])
         location = get_geolocation(row[5])
         if location != None:
-            d = {'category':row[2], 'amount':float(row[3].replace(',','')), 'lat':location['lat'], 'lng':location['lng']}
+            d = {'timestamp':row[0], 'category':row[2], 'amount':float(row[3].replace(',','')), 'lat':location['lat'], 'lng':location['lng']}
             data.append(d)
 
 print 'var data = ['