Proto eye

forked from Raphael-Diana's block: Proto eye

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Proto_eye</title>
    <script src="https://d3js.org/d3.v4.js"></script>
    <script src="https://d3js.org/d3-queue.v3.min.js"></script>
    <script src="eye.js"></script>
</head>
<body>
<div>
    <span id="generation_counter">NA</span>
</div>

var margin = {top: 50, right: 20, bottom: 50, left: 20},
        width = 350 - margin.left - margin.right,
        height = 350 - margin.top - margin.bottom;

var generation_count = 0;

// Asynchronously load the data
    d3.queue()
        .defer(d3.csv, "best_per_gen.csv")
        .await(processData);

function processData(error, data) {
        if (error) throw error;

data.forEach(function (d) {
            d.a = +d.a;
            d.i = +d.i;
            d.phi_1 = +d.phi_1;
            d.rho_c = +d.rho_c;
        });

initEye();
        drawEye(data[generation_count]);
        d3.select('#generation_counter').html(generation_count);

d3.interval(function() {
            //console.log(generation_count);
            generation_count += 1;
            if (generation_count >= data.length) {
                generation_count = 0;
            }
            d3.select('#generation_counter').html(generation_count);
            updateEye(data[generation_count]);
        }, 30);

}

</script>

</body>
</html>

https://d3js.org/d3.v4.js

https://d3js.org/d3-queue.v3.min.js