<commit_before>function barChartInit(elId, data) {

    var margin = {top: 50, right: 20, bottom: 10, left: 465};
    var height = 0, width = 0;

    var y = d3.scale.ordinal();

    var x = d3.scale.linear();

    function resize(){
        width = parseInt(d3.select("#buildResultsInner").style("width")) - margin.left - margin.right;
        height = Object.keys(data).length * 100 - margin.top - margin.bottom;
        x.rangeRound([0, width]);
        y.rangeRoundBands([0, height], .3);
    }
    
    resize();

    var color = d3.scale.ordinal()
        .range(["#c7001e", "#f6a580", "#cccccc", "#92c6db", "#086fad", "#009999", "#00CC99", "#00CC66", "#00CC00", "#00FF00", "#000000"]);

    var xAxis = d3.svg.axis()
        .scale(x)
        .orient("top")
        .tickFormat(function (d) {
            return d + " ms"
        });

    var yAxis = d3.svg.axis()
        .scale(y)
        .orient("left");

    var svg = d3.select(elId).append("svg")
        .attr("width", width + margin.left + margin.right)
        .attr("height", height + margin.top + margin.bottom)
        .attr("id", "d3-plot")
        .append("g")
        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

    color.domain(["0.0", "50.0", "90.0", "95.0", "99.0", "99.9", "99.99", "99.999", "99.9999", "100.0", "average"]);

    (function (data) {
        for (var benchmarkName in data) {
            d = data[benchmarkName];
            var xPrev = d["0.0"];
            d.boxes = color.domain().map(function (name) {
                var a = {
                    name: name,
                    x0: xPrev,
                    x1: d[name],
                    N: parseFloat(name),
                    n: d[name]
                };
                xPrev = d[name];
                return a;
            });
        }

        var min_val = d3.min(d3.values(data), function (d) {
            return d.boxes[0].x0;
        });
<commit_msg>try to make it responsive<commit_after>function barChartInit(elId, data) {

    var margin = {top: 50, right: 20, bottom: 10, left: 465};
    var height = 0, width = 0;

    var y = d3.scale.ordinal();

    var x = d3.scale.linear();

    var xAxis = d3.svg.axis()
        .orient("top")
        .tickFormat(function (d) {
            return d + " ms"
        });

    var yAxis = d3.svg.axis()
        .scale(y)
        .orient("left");

    function resize(){
        width = parseInt(d3.select("#buildResultsInner").style("width")) - margin.left - margin.right;
        height = Object.keys(data).length * 100 - margin.top - margin.bottom;
        x.rangeRound([0, width]);
        y.rangeRoundBands([0, height], .3);
        xAxis.scale(x);
        yAxis.scale(y);
    }

    resize();

    var color = d3.scale.ordinal()
        .range(["#c7001e", "#f6a580", "#cccccc", "#92c6db", "#086fad", "#009999", "#00CC99", "#00CC66", "#00CC00", "#00FF00", "#000000"]);

    var svg = d3.select(elId).append("svg")
        .attr("width", width + margin.left + margin.right)
        .attr("height", height + margin.top + margin.bottom)
        .attr("id", "d3-plot")
        .append("g")
        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

    color.domain(["0.0", "50.0", "90.0", "95.0", "99.0", "99.9", "99.99", "99.999", "99.9999", "100.0", "average"]);

    (function (data) {
        for (var benchmarkName in data) {
            d = data[benchmarkName];
            var xPrev = d["0.0"];
            d.boxes = color.domain().map(function (name) {
                var a = {
                    name: name,
                    x0: xPrev,
                    x1: d[name],
                    N: parseFloat(name),
                    n: d[name]
                };
                xPrev = d[name];
                return a;
            });
        }

        var min_val = d3.min(d3.values(data), function (d) {
            return d.boxes[0].x0;
        });

{'fraction_non_alphanumeric': 0.18762729124236252, 'fraction_numerical': 0.056517311608961306, 'mean_word_length': 1.737979094076655, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '143480', 'n_tokens_mistral': 1452, 'n_tokens_neox': 1295, 'n_words': 279}