D3 Examples - 2015-12-15

xxxxxxxxxx
 
<!DOCTYPE html>
<meta charset="utf-8">
<style>
​
</style>
<body>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.0.6/bluebird.js"></script>
<script src="db.js"></script>
<script src="generator.js"></script>
<script>
​
var n = 6, // number of generators
    latency = d3.random.normal(500, 50); //milliseconds
​
var margin = {top: 250, right: 40, bottom: 250, left: 40},
    width = 960 - margin.left - margin.right,
    height = 500 - margin.top - margin.bottom;
​
var svg = d3.select("body").append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
  .append("g")
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
​
var upper = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
var lower = 'abcdefghijklmnopqrstuvwxyz';
var database = 'AaBbCDEFfGHIiJjKkLMmNOoPpQRSTtUVWwXYZz';
​
var hooks = d3.range(n).map(function(d) {
    alphabet = (Math.random() > 0.5) ? upper : lower;
    return alphabet.charAt(Math.random()*26 | 0);
});
​
var generators = d3.range(n).map(function(d, i) {
    return db.generator()
                .query(query)
                .limit(5)
                (hooks[i]);
});
​
var unique = d3.set();
​
Promise.all(generators.map(peek)).then(function iterate(values) {
​
    var max = -1,
        chosen = -1,
        best = null,
        found = 0;
​
    values.forEach(function(d, i) {
        if(!d.done) {
            var v = d.value;
            var f = (v.toLowerCase() == v) ? 1 : .5;
            var score = 1/((lower.indexOf(v.toLowerCase()) + 1) * f);
            
            if(score >= max) {
                chosen = i;
                max = score;
                best = v;
            }
            found += 1;
        }
    });
​
    if(found > 0) {
        unique.add(best);
        return generators[chosen].next().then(function() {
            console.log("Generators that are not done:", found);
            return Promise.all(generators.map(peek)).then(iterate);
        });
    } else {
        return Promise.resolve(unique.values().sort(comparator));
    }
}).then(function(result) {
    console.log(result);
});
​
// simulated PostgreSQL query using the pg-promise library
function query(text, limit, offset) {
    var re = new RegExp(text, 'g');
    var results = database.match(re)|| [];
    return Promise.resolve(results.slice(offset, offset + limit).sort()).delay(latency());
}
​
function peek(generator){
    return generator.peek();
}
​
function comparator(a, b) {
    var value = a.toLowerCase().localeCompare(b.toLowerCase());
    return (value == 0) ? - a.localeCompare(b) : value;
}
</script>
    