Sparkline SVG

Generate a Sparkline as an SVG.

Install

* npm install sparkline-svg or
* yarn add sparkline-svg

Table of Contents

* Use
* d
* dataUri
* outerHTML
* setDecimals
* setDesc
* setDescription
* setFill
* setHeight
* setPreserveAspectRatio
* setStroke
* setStrokeWidth
* setTitle
* setValues
* setViewBoxHeight
* setViewBoxWidth
* setWidth

Use

The sparkline-svg package exports a Sparkline class, which can be constructed with or without an array of values used to generate the sparkline.

``JavaScript
import Sparkline from 'sparkline-svg';

const sparkline= new Sparkline();
// or
const sparkline = new Sparkline(values);
`

$3

sparkline.d returns the 's d attribute for the sparkline (stroke) itself.

$3

sparkline.dataUri returns the sparkline SVG as a data URI, i.e. data:image/svg+xml;base64,.... This is particularly useful for CSS background images.

$3

sparkline.outerHTML returns a string of the HTML for an SVG containing the sparkline.

$3

Sets the number of decimal places used to generate the sparkline. A larger number of decimal places will result in better precision, but a larger file size.

_Default: 4_

$3

Sets the description of the sparkline. Used to populate the element.

_Default: 'A line graph representation of a value\'s change over time.'_

$3

Synonymous with setDesc.

$3

Sets the color of the area underneath the sparkline.

_Default: 'transparent'_

$3

Sets the height of the sparkline's SVG element. Not to be confused with setViewBoxHeight.

_Default: '100%'_

$3

Sets the preserveAspectRatio attribute of the SVG element.

_Default: 'none'_

$3

Sets the color of the sparkline itself.

_Default: 'currentColor'_

$3

Sets the width of the sparkline itself. If using a number, this will be relative to the view box height and width.

_Default: '1%'_

$3

Sets the title of the sparkline SVG by populating the