gistfile1.js

var amountFn, chart, dateFn, format, lineGn, svg, x, y;

format = d3.time.format("%Y-%m-%d");

chart = {};

amountFn = function(d) {
  return d.remaining_time;
};

dateFn = function(d) {
  return format.parse(d.date);
};

x = d3.time.scale().range([10, 290]);

y = d3.scale.linear().range([190, 10]);

lineGn = d3.svg.line().x(function(d) {
  return x(dateFn(d));
}).y(function(d) {
  return y(amountFn(d));
});

svg = d3.select("#demo").append("svg:svg").style('background-color', 'white').attr("width", 300).attr("height", 200);

svg.append("svg:g");

chart.refresh = function(data) {
  var circles, g;
  x.domain(d3.extent(data, dateFn));
  y.domain(d3.extent(data, amountFn));
  circles = svg.selectAll("circle").data(data);
  circles.transition().attr("cx", function(d) {
    return x(dateFn(d));
  }).attr("cy", function(d) {
    return y(amountFn(d));
  });
  circles.enter().append("svg:circle").attr('class', 'circle').attr("r", 4).attr("cx", function(d) {
    return x(dateFn(d));
  }).attr("cy", function(d) {
    return y(amountFn(d));
  });
  g = svg.select('g').data(data);
  return g.transition().attr('d', lineGn);
};

return chart;