# fill-colorcoded-bar

> Progressively fill a colorcoded bar based on an async data source

Latest version **1.0.5** (published 2015-10-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install fill-colorcoded-bar
pnpm add fill-colorcoded-bar
yarn add fill-colorcoded-bar
bun add fill-colorcoded-bar
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.5 |
| Published | 2015-10-13 |
| First published | 2015-10-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Maintainers | juliangruber |

## Links

- npm: https://www.npmjs.com/package/fill-colorcoded-bar
- Repository: https://github.com/juliangruber/fill-colorcoded-bar
- Issues: https://github.com/juliangruber/fill-colorcoded-bar/issues
- npm.io page: https://npm.io/package/fill-colorcoded-bar

## Dependencies (2)

- [run-parallel](https://npm.io/package/run-parallel.md) ^1.1.4
- [partition-refinement-iterator](https://npm.io/package/partition-refinement-iterator.md) ^1.0.0

## Recent versions

- 1.0.5 (latest) — 2015-10-13
- 1.0.4 — 2015-10-12
- 1.0.3 — 2015-10-12
- 1.0.2 — 2015-10-12
- 1.0.1 — 2015-10-12
- 1.0.0 — 2015-10-12

## README

# fill-colorcoded-bar

  Progressively fill a [colorcoded-bar](https://npmjs.org/package/colorcoded-bar) based on an async data source.

## Screencast

  This shows two bars rendering the same data, using different strategies.

  ![animation](animation.gif)

## Example

  [![view on requirebin](http://requirebin.com/badge.png)](http://requirebin.com/?gist=5d2096105d5acd69325d)

```js
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);
})();
```

## Installation

```bash
$ npm install fill-colorcoded-bar
```

## API

### fill(bar[, opts], fetch)

  Fill [colorcoded-bar](https://npmjs.org/package/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 bar
- `length`: total data length, required by the refine strategy
- `concurrency`: concurrency when calling `fetch`. defaults to `10`

Returns an EventEmitter that will emit `"done"` when done and has a property `.fetching` that becomes `false` once everything is done.

## License

  MIT

---
_Source: https://npm.io/package/fill-colorcoded-bar · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
