simple data canvas barchart

_.md

[ Launch: simple data canvas barchart ] 2b66b9ed7cfc364e37ca by enjalot

config.json

{"description":"simple data canvas barchart","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"ajax-caching":true,"thumbnail":"http://i.imgur.com/44osyvF.png"}

inlet.js

// Get more data: http://enjalot.github.io/datacanvas/
// for the datacanvas.org challenge

var url = "http://sensor-api.localdata.com/api/v1/aggregations.csv?op=mean&fields=temperature,light,airquality_raw,sound,humidity,dust&resolution=1h&over.city=San Francisco&from=2015-02-27T08:00:00.000Z&before=2015-02-28T08:00:00.000Z"
//url = "http://sensor-api.localdata.com/api/v1/aggregations.csv?op=mean&fields=temperature,light,airquality_raw,sound,humidity,dust&resolution=1h&over.city=Bangalore&from=2015-02-27T08:00:00.000Z&before=2015-02-28T08:00:00.000Z"
d3.csv(url, function(err, data) {
  //console.table(data)
  
  var field = "sound"
  field = "light"
  
  var height = 400
  
  var xscale = d3.scale.ordinal()
  .domain(d3.range(data.length))
  .rangeBands([50, 400], 0.376)
  
  var yscale = d3.scale.linear()
  .domain(d3.extent(data, function(d) { return +d[field] }))
  .range([0, height])
  
  var svg = d3.select("svg");
  
  var rects = svg.selectAll("rect")
    .data(data)
  
  rects.enter().append("rect")
  
  rects.attr({
    x: function(d,i) { return xscale(i) },
    y: function(d,i) { return 50 + height - yscale(+d[field]) },
    width: xscale.rangeBand(),
    height: function(d,i) { return yscale(+d[field]) }
  })
})