# Commonly Used Utilities JavaScript Library

## Usage

```js
import d3Utils from 'd3-utils';
import 'd3-utils.css';
// Attach <svg> to `el` DOM element
d3Utils.draw(type, el, tooltip, data, width, height, xType, xKey, yKey, xToFixed, yToFixed, labels, warningLevel);
```

## Functions

* `createBarGraph(el, tooltip, data, width, height, xKey, yKey, xToFixed, yToFixed, labels, warningLevel)`
* `createLineChart(el, tooltip, data, width, height, xType, xKey, yKey, xToFixed, yToFixed, labels, warningLevel)` -Array must be sorted by x before passing to this function or the line will jump all over the place
* `createPieChart(el, tooltip, data, width, xType, xKey, yKey, xToFixed, yToFixed, labels)`
* `createScatterPlot(el, tooltip, data, width, height, xType, xKey, yKey, xToFixed, yToFixed, labels, warningLevel)` - Unlike LineChart, this array does not need to be sorted by x
* `classPicker(value, warningLevel)`
* `draw(type, el, tooltip, data, width, height, xType, xKey, yKey, xToFixed, yToFixed, labels, warningLevel)` - Set defaults for any properties not pased in
* `getValue(inputValue, toFixed)`
* `scale(data, xType, key, range, useMin = false)` - Scale to best fit data into viewable space
* `showLabels(data, key, value, type, useMin = true)` - Allows for either showing no labels, just the min and max labels, or all labels

## Function Input Parameters

* `el` - the DOM element (usually a `<div>`) that the SVG will be appended to
* `tooltip` - The tooltip that should display when hovering over the chart.  Example:

```js
const tooltip = d3.select('body')
                .append('div')
                .attr('class', 'd3-tooltip')
                .style('opacity', 0)
                .style('pointer-events', 'none')
                .style('position', 'absolute');
```

* `data` - Can be any complex object
* `xType` - `'date'` or `'value'`
* `xKey` - The `data` object's property used for the x-axis
* `yKey` - The `data` object's property used for the y-axis
* `xToFixed` - Level of precision when showing x value in tooltap.  Default=`Infinity`
* `yToFixed` - Level of precision when showing y value in tooltap.  Default=`Infinity`
* `labels` - `'none'`, `'minmax'` or `'all'`
* `warningLevel` - Changes the color of the plotted object if its y value exceeds this threshold


