<commit_before><!DOCTYPE html>
<meta charset="utf-8">
<style>
body { margin: 0; }

.background {
    fill: hsl(0, 0%, 100%);
    stroke: none;
}

.shapes {
    pointer-events: none;
}

.subunit {
    fill: hsl(0, 0%, 75%);
    stroke: hsl(0, 0%, 100%);
}

text {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 64px;
    pointer-events: none;
}

</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script>

var width = 900,
    height = 1088;

var formatArea = d3.format(".2r"),
    formatPercent = d3.format(".2%");

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);

var background = svg.append('rect')
    .attr('class', 'background')
    .attr('width', width)
    .attr('height', height);

var shapes = svg.append('g')
    .attr('class', 'shapes');

var text = svg.append("text")
    .attr("x", width / 2)
    .attr("y", height / 2)
    .attr("dy", ".35em")
    .attr("text-anchor", "middle");

d3.json("uk.topo.json", function(error, uk) {
    if (error) return console.error(error);

    var albersProjection = d3.geo.albers()
        .center([0, 55.4])
        .rotate([4.4, 0])
        .parallels([50, 60])
        .scale(5625)
        .translate([width / 2, height / 2]);

console.log(uk);
    var subunits = topojson.feature(uk, uk.objects.subunits);

    var maxArea = 0;
    redraw(0);

    var x = d3.scale.sqrt()
        .domain([0, maxArea])
        .range([0, width]);

    background.on('mousemove', function() {
        var minArea = x.invert(d3.mouse(this)[0]);
        redraw(minArea);
    });


    function redraw(minArea) {
        var m = 0;
        var n = 0;

        var filterPoints = d3.geo.transform({
          point: function(x, y, z) {
            m++;
            if (!(z < minArea)) {
                n++;
                this.stream.point(x, y);
            }
            if (z > maxArea) {
                maxArea = z;
            }
          }
        });

        var path = d3.geo.path()
            .projection({
                stream: function(s) {
                    return filterPoints.stream(albersProjection.stream(s));
                }
            })
            .pointRadius(3);

        var subunitShapes = shapes.selectAll(".subunit")
            .data(subunits.features);

        subunitShapes.enter().append("path")
            .attr("class", function(d) { return "subunit " + d.id; });

        subunitShapes
            .attr("d", path);

        text.text(formatArea(minArea) + "sr / " + formatPercent(n / m));
    }

});

</script><commit_msg>Filter geometry based on zoom level<commit_after><!DOCTYPE html>
<meta charset="utf-8">
<style>
body { margin: 0; }

.background {
    fill: hsl(0, 0%, 100%);
    stroke: none;
}

.shapes {
    pointer-events: none;
}

.subunit {
    fill: hsl(0, 0%, 75%);
    stroke: hsl(0, 0%, 100%);
}

text {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 64px;
    pointer-events: none;
}

</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script>

var width = 900;
var height = 1088;
var baseScale = 5625;

var formatArea = d3.format(".2r"),
    formatPercent = d3.format(".2%");

var zoom = d3.behavior.zoom()
    .scale(baseScale)
    .translate([width / 2, height / 2]);

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);

var background = svg.append('rect')
    .attr('class', 'background')
    .attr('width', width)
    .attr('height', height)
    .call(zoom);

var shapes = svg.append('g')
    .attr('class', 'shapes');

var text = svg.append("text")
    .attr("x", width / 2)
    .attr("y", height / 2)
    .attr("dy", ".35em")
    .attr("text-anchor", "middle");
var tspan1 = text.append('tspan')
    .attr('x', text.attr('x'))
    .attr('y', text.attr('y'))
    .attr('dy', '.35em');
var tspan2 = text.append('tspan')
    .attr('x', text.attr('x'))
    .attr('y', text.attr('y'))
    .attr('dy', '1.45em');

d3.json("uk.topo.json", function(error, uk) {
    if (error) return console.error(error);

    var subunits = topojson.feature(uk, uk.objects.subunits);

    var areaInSteradians = d3.geo.area(subunits);

    var albersProjection = d3.geo.albers()
        .center([0, 55.4])
        .rotate([4.4, 0])
        .parallels([50, 60])
        .scale(zoom.scale())
        .translate(zoom.translate());

    var areaInPixels = d3.geo.path().projection(albersProjection).area(subunits);
    var baseSteradiansPerSquarePixels = areaInSteradians / areaInPixels;
    console.log(baseSteradiansPerSquarePixels);

    var maxArea = 0;
    redraw(baseSteradiansPerSquarePixels);

    var x = d3.scale.sqrt()
        .domain([0, maxArea])
        .range([0, width]);

    zoom.on('zoom', function() {
        var magnification = d3.event.scale / baseScale;
        var steradiansPerSquarePixels = baseSteradiansPerSquarePixels / Math.pow(magnification, 2);

        albersProjection
            .scale(d3.event.scale)
            .translate(d3.event.translate);
        redraw(steradiansPerSquarePixels);
    });

    function redraw(steradiansPerSquarePixels) {
        console.time('redraw');

        var m = 0;
        var n = 0;

        var filterPoints = d3.geo.transform({
          point: function(x, y, z) {
            m++;
            if (!(z < steradiansPerSquarePixels)) {
                n++;
                this.stream.point(x, y);
            }
            if (z > maxArea) {
                maxArea = z;
            }
          }
        });

        var path = d3.geo.path()
            .projection({
                stream: function(s) {
                    return filterPoints.stream(albersProjection.stream(s));
                }
            })
            .pointRadius(3);

        var subunitShapes = shapes.selectAll(".subunit")
            .data(subunits.features);

        subunitShapes.enter().append("path")
            .attr("class", function(d) { return "subunit " + d.id; });

        subunitShapes
            .attr("d", path);

        tspan1.text(formatArea(steradiansPerSquarePixels) + "sr/px²");
        tspan2.text(formatPercent(n / m) + " of pts");

        console.timeEnd('redraw');
    }

});

</script>
{'fraction_non_alphanumeric': 0.17942073170731707, 'fraction_numerical': 0.02423780487804878, 'mean_word_length': 2.2320197044334975, 'pattern_counts': {'":': 0, '<': 31, '<?xml version=': 0, '>': 31, 'https://': 2, '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': '1248703', 'n_tokens_mistral': 2418, 'n_tokens_neox': 2269, 'n_words': 431}