1 // Based on http://bl.ocks.org/900762 by John Firebaugh

     2 d3.json("../data/faithful.json", function(faithful) {

     3   data = faithful;

     4   var w = 800,

     5       h = 400,

     6       x = d3.scale.linear().domain([30, 110]).range([0, w]);

     7       bins = d3.layout.histogram().frequency(false).bins(x.ticks(60))(data),

     8       max = d3.max(bins, function(d) { return d.y; }),

     9       y = d3.scale.linear().domain([0, .1]).range([0, h]),

    10       kde = science.stats.kde().sample(data);

    11 

    12   var vis = d3.select("body")

    13     .append("svg:svg")

    14       .attr("width", w)

    15       .attr("height", h);

    16 

    17   var bars = vis.selectAll("g.bar")

    18       .data(bins)

    19     .enter().append("svg:g")

    20       .attr("class", "bar")

    21       .attr("transform", function(d, i) {

    22         return "translate(" + x(d.x) + "," + (h - y(d.y)) + ")";

    23       });

    24 

    25   bars.append("svg:rect")

    26       .attr("fill", "steelblue")

    27       .attr("width", function(d) { return x(d.dx + 30) - 1; })

    28       .attr("height", function(d) { return y(d.y); });

    29 

    30   var line = d3.svg.line()

    31       .x(function(d) { return x(d[0]); })

    32       .y(function(d) { return h - y(d[1]); });

    33 

    34   vis.selectAll("path")

    35       .data(d3.values(science.stats.bandwidth))

    36     .enter().append("svg:path")

    37       .attr("d", function(h) {

    38         return line(kde.bandwidth(h)(d3.range(30, 110, .1)));

    39       });

    40 });