function displayNumber(x) {
    // Simple function to denote millions (M) and thousands (K).
    // TODO: Add a decimal point or two to M/K?

    if (x > 1000000) {return Math.floor(x/1000000) + "M";}
    if (x > 1000) {return Math.floor(x/1000) + "K";}
    return x;
}

function createHistogram(orig, name, title)
{
    // Creates a histogram style SVG graph at object with id name with data from orig and title.

    var width = 900;    // Graph width
    var height = 400;   // Graph height

    var data = [];    // Orig is a JSON object, and is split up into
    var labels = [];  // these arrays by key/value.
    d3.map(orig).forEach(function (d, i) { data.push(i["count"]); labels.push(i["time"]);});

    var chart = d3.select("#" + name) // Select the right object,
        .append("svg")      // add an SVG to it,
        .attr("class", "chart").attr("width", width).attr("height", height); // and create a chart.

    var x = d3.scale.ordinal()
        .domain(labels)
        .rangeBands([0, width]); // Split the keys up into distinct bands.

    var y = d3.scale.linear()
        .domain([0, d3.max(data)])
        .range([height, 25]);     // y = 0 is at the top of the graph, so we scale and flip the value.

    chart.append("line")                         // Create a line
        .attr("x1", 0).attr("x2", width)        // going across the graph
        .attr("y1", height).attr("y2", height)  // at the bottom
        .style("stroke", "#aaa");

    chart.selectAll("rect").data(data).enter()                             // Create the bars
        .append("a")                                                       // with links
        .attr("xlink:href", function(d, i) {return "/query";})             // that link to /query. TODO
        .append("rect").attr("x", x).attr("y", height)                     // The bars start at the bottom
        .attr("height", 0)                                                 // with no height for now
        .attr("width", x.rangeBand() - 3)                                  // leave 3px of padding between them
        .attr("rel", "tooltip_top")                                        // and add a tooltip with the value.
        .attr("data-original-title", function(d, i) {return displayNumber(data[i]);});

    chart.append("svg:text")                                                    // Give us a title
        .attr("x", width/3)
        .attr("y", 15)
        .attr("font-size", 16)
        .text(title);

    chart.selectAll("rect").data(data)
        .transition().duration(1000)           // Finally, create a 1-second transition
        .attr("height", height).attr("y", y);  // of the bars rising up to their real height.
}
