gistfile1.js

(function() { 

  var TS = function(options) {
    _.defaults(options, {
       width: 300,
       height: 210,
       margin: 24,
       min: 0,
       max: 100
    });

    var width = options.width,
        height = options.height,
        margin = options.margin,
        min = options.min, 
        max = _.max(values),
        values = _.union(_.values(options.data)),
        dates = options.dates,
        parse = d3.time.format("%Y-%m-%d").parse,
        dateFormat = d3.time.format("%m/%d"),
        y = d3.scale.linear().domain([0, max])
          .range([0 + margin, height - margin]),
        baseline = d3.scale.linear().range([0 + margin, w - margin]),
        x = d3.time.scale()
          .domain([parse(_.first(dates)), parse(_.last(dates))])
          .range([0 + margin, w - margin]),
        vis = d3.select(".listing-chart")
          .append("svg:svg")
          .attr("width", w)
          .attr("height", h),
        g = vis.append("svg:g")
          .attr("transform", "translate(30, 200)"),
        line = d3.svg.line()
          .x(function(d) { return x(parse(d[0])); })
          .y(function(d) { return -1 * y(d[1]); });

    g.selectAll(".xTicks")
      .data(x.ticks(d3.time.days, 1))
      .enter().append("svg:line")
      .attr("class", "xTicks")
      .attr("x1", function(d) { return x(d); })
      .attr("y1", -h)
      .attr("x2", function(d) { return x(d); })
      .attr("y2", -10);

    g.selectAll(".yTicks")
      .data(y.ticks(4))
      .enter().append("svg:line")
      .attr("class", "yTicks")
      .attr("y1", function(d) { return -1 * y(d); })
      .attr("x1", baseline(-0.03))
      .attr("y2", function(d) { return -1 * y(d); })
      .attr("x2", w);

    g.append("svg:path")
      .style('stroke', 'steelblue')
      .attr("d", line(data));

    g.selectAll(".xLabel")
      .data(x.ticks(d3.time.days, 2))
      .enter().append("svg:text")
      .attr("class", "xLabel")
      .text(function(d) { return df(d); })
      .attr("x", function(d) { return x(d); })
      .attr("y", 0)
      .attr("text-anchor", "middle");

    g.selectAll(".yLabel")
      .data(y.ticks(4))
      .enter().append("svg:text")
      .attr("class", "yLabel")
      .text(String)
      .attr("x", -30)
      .attr("y", function(d) { return -1 * y(d); })
      .attr("text-anchor", "right")
      .attr("dy", 4);

  };

}());