bar-chart

Generate a bar chart in svg format to be used as an API response.

example output

Single Value

svg output

Muliple Values

svg output

Stacked

svg output

usage

import barChart from '@byu-oit/bar-chart'

const myData = [10, 12, 14, 24, 38]
const myDataLabels = ['A', 'B', 'C', 'D', 'E']
const chartSvg = barChart({data: myData, labels: myDataLabels})

parameter definition

The bar chart function takes a single configuration parameter.

key | type | required? | description --- | ----- | --------- | ----------- data | Array of Numbers, or 2 Dimensional Array of Numbers | required | An array of values to chart. For example, if you want to chart visits per day, your data could be [104, 78, 120, 88] with labels of ['May 13', 'May 14', 'May 15', 'May 16']. The values may themselves be arrays, but must all have the same length. labels | Array of Strings | required | An array of string labels corresponding by index to the associated data element. legendLabels | [string labels] | optional | An array of labels for the bar colors. For example, you could chart visits per day, with each browser in a different color. stacked | boolean | optional, default is false | If true, the bars will be stacked instead of side-by-side. colors | Array of Strings | optional | Supply custom colors for the bars. showValues | boolean | optional, default is false | If true, the value will be shown near the top of each bar.