$ npm install fill-colorcoded-barProgressively fill a colorcoded-bar based on an async data source.
This shows two bars rendering the same data, using different strategies.
var fill = require('fill-colorcoded-bar');
var Bar = require('colorcoded-bar');
var raf = require('raf');
var canvas = document.createElement('canvas');
document.body.appendChild(canvas);
var bar = new Bar;
var status = fill(bar, {
strategy: 'topdown',
length: 1000
}, function(i, cb){
setTimeout(function(){
cb(null, 'rgba(1, 1, 1, ' + Math.random() + ')');
}, Math.random() * 300);
});
(function draw(){
bar.render({ width: 100, height: 600, canvas: canvas });
if (status.fetching) raf(draw);
})();
$ npm install fill-colorcoded-bar
Fill colorcoded-bar bar based on function fetch which is expected to take (i, callback) and call callback with (null, color).
Options:
strategy choose the strategy:
"topdown": render top to bottom"refine": progressively refine the barlength: total data length, required by the refine strategyconcurrency: concurrency when calling fetch. defaults to 10Returns an EventEmitter that will emit "done" when done and has a property .fetching that becomes false once everything is done.
MIT