npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

chartscii

v1.3.2

Published

awesome ascii charts

Downloads

1,555

Readme

install

npm install chartscii

usage

chartscii accepts an array of data objects, with optional labels, and outputs an ascii bar chart.

usage example

const Chartscii = require('chartscii');


// generate random chart data
const data = [];

for (let i = 1; i <= 20; i++) {
    data.push(Math.floor(Math.random() * 100) + 1);
}

// create chart
const chart = new Chartscii(data, {
    label: 'Example Chart',
    theme: 'lush',
    width: 50,
    sort: true,
    reverse: true,
    color: 'pink'
});
console.log(chart.create(), 'example')

outputs:

you can customize the acsii character for the bar chart using the char option. for example:

const chart = new Chartscii(data, {
    label: 'Example Chart',
    theme: 'pastel',
    width: 50,
    char: '■',
    sort: true,
    reverse: true,
    color: 'green'
});

outputs:

typescript usage example

example usage in typescript:

import Chartscii, {ChartData} from 'chartscii';

const data: Array<ChartData> = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const chart: Chartscii = new Chartscii(data, { naked: true });
console.log(chart.create());

options

data options

chartscii accepts data in objects or simply an array of numeric values

[{ value: 2, label: 'some_label' }, { value: 2, label: 'some_label' }] 
[3, 34, 45]

label (string)

a label for the data point.

value (number)

a value for a bar in a chart.

color (string)

a color to paint the bar (colors label as well if colorLabel: true)
color should correspond to the supported colors

chart options

label (string)

a label for the chart.

width (number)

the width of the chart, scales values accordingly
default: 100

sort (boolean)

sort data
default: false

reverse (boolean)

reverse chart values order
default: false

char (string)

ascii char for bars
default:

fill (string)

fill chart with ascii character.
no default.
recommended:

color (string)

color bars in chart and label if provided.
see colors

percentage (boolean)

show percentage of each bar, using the highest value in the provided data array
default false

colorLabels (boolean)

color labels as well
default false

naked (boolean)

don't print chart ascii structure default false

color

this lib uses styl3, which has built in themes, the string you input in the color property of the chart or of a data point, will change depending on the theme. defaults to pastel.
these are the currently supported colors, provided as string in the data object (e.g { value: 3, color: 'green' }) or for the entire chart as an option.

  • red
  • green
  • yellow
  • blue
  • purple
  • pink
  • cyan
  • orange

NOTE: you can also provide a string formatted color: '\x1b[32;1m' see: https://misc.flogisoft.com/bash/tip_colors_and_formatting

themed charts