Home

Awesome

@gribnoysup/wunderbar

Have you ever wanted to print some pretty bar charts in your terminal? You are in the right place!

wunder-bar-cli-all

Wunderbar can print horisontal bar chart with legend and chart scale straight to your terminal. Or you can use it as a module in your code and get all the building blocks to print chart yourself.

Wunderbar uses partial block characters (▏▎▍▌▋▊▉█) to print the most precise charts possible:

wunder-bar-precise

Use in terminal

echo "[1, 2, 3, 4, 5]" | npx @gribnoysup/wunderbar --min 0

wunder-bar-echo-json

cat data.json | npx @gribnoysup/wunderbar --min 0

wunder-bar-cat-file

Use in your code

npm i --save @gribnoysup/wunderbar
const wunderbar = require('@gribnoysup/wunderbar');
const data = require('./data.json');

const printData = () => {
  const { chart, legend, scale, __raw } = wunderbar(data, {
    min: 0,
    length: 42,
  });

  console.log();
  console.log(chart);
  console.log();
  console.log(scale);
  console.log();
};

printData();

Limitations

API

wunderbar(values, [options]) ⇒ OutputValue

ParamTypeDefaultDescription
valuesArray<InputValue>Values to draw on a chart
[options]ObjectChart drawing options
[options.min]numbermin value from valuesMin chart value (inclusive)
[options.max]numbermax value from valuesMax chart value (inclusive)
[options.length]numberterminal widthChart length
[options.sort]<code>"min" | "max" | "none" | (a: NormalizedValue, b: NormalizedValue) => number</code>"none"Sort method for chart values
[options.randomColorOptions]Object{}randomColor options for color generation
[options.format]<code>string | (a: number) => string</code>"0.00"Value format method. String values are Numeral.js format strings

All options are also supported in the cli version:

echo "[1000, 3000, 5000, 7000, 9000, 11000]" | \
  npx @gribnoysup/wunderbar --min 0 --max 15000 --length 42 --sort min --randomColorOptions '{ "seed": "unicorn" }' --format "0a"

wunder-bar-cli-all

Types

<a name="#InputValue">InputValue</a> : { value: number, color?: string, label?: string } | number | string

<a name="#OutputValue">OutputValue</a> : { legend: string, scale: string, chart: string, __raw: RawData }

<a name="#RawData">RawData</a> : { chartLength: number, minValue: number, minValueFormatted: string, maxValue: number, maxValueFormatted: string, normalizedValues: NormalizedValue[] }

<a name="#NormalizedValue">NormalizedValue</a> : { normalizedValue: number, rawValue: number, formattedValue: string, color: string, label: string, lineLength: number, chartBar: string, coloredChartBar: string }

License

MIT