Comparing version 0.0.182 to 0.0.183
{ | ||
"name": "@vx/stats", | ||
"version": "0.0.182", | ||
"version": "0.0.183", | ||
"description": "vx stats box violin", | ||
@@ -17,3 +17,4 @@ "sideEffects": false, | ||
"prepublish": "npm run build", | ||
"test": "jest" | ||
"test": "jest", | ||
"docs": "cd ./docs && ../../../node_modules/.bin/react-docgen ../src/{boxplot,violinplot} | ../../../scripts/buildDocs.sh" | ||
}, | ||
@@ -38,3 +39,3 @@ "repository": { | ||
"dependencies": { | ||
"@vx/group": "0.0.182", | ||
"@vx/group": "0.0.183", | ||
"@vx/scale": "0.0.182", | ||
@@ -41,0 +42,0 @@ "classnames": "^2.2.5", |
121
Readme.md
# @vx/stats | ||
<a title="@vx/stats npm downloads" href="https://www.npmjs.com/package/@vx/stats"> | ||
<img src="https://img.shields.io/npm/dm/@vx/stats.svg?style=flat-square" /> | ||
</a> | ||
## Installation | ||
``` | ||
@@ -7,34 +14,92 @@ npm install --save @vx/stats | ||
## BoxPlot | ||
A boxplot shows the minimum, maximum, and quartiles of a dataset. | ||
## Components | ||
You can pass in props to target the `min`, `max`, `median`, and `box (interquartile range)` shapes using `minProps`, `maxProps`, `medianProps`, and `boxProps`. | ||
If you are looking to add events over the each boxplot group you can pass in `container={true}` and `containerProps={{ /** */ }}`. | ||
## <BoxPlot /> Properties | ||
- [BoxPlot](#boxplot-) | ||
- [ViolinPlot](#violinplot-) | ||
| Name |Default| Type | Description | | ||
|:------------------|:------|:----------|:------------------------------| | ||
| className | | string | The className for the boxplot | | ||
| left | 0 | number | The left offset of the boxplot | | ||
| data | | array | An array of data | | ||
| max | | number | The maximum value for boxplot | | ||
| min | | number | The minimum value for boxplot | | ||
| firstQuartile | | number | The value for the first quartile for the boxplot | | ||
| thirdQuartile | | number | The value for the third quartile for the boxplot | | ||
| median | | number | The median value for the boxplot | | ||
| boxWidth | | number | The width of the box | | ||
| fill | | string | The color of the box | | ||
| fillOpacity | | number | The opacity of the box | | ||
| stroke | | string | The color of the lines in boxplot | | ||
| strokeWidth | | number | Width of the lines in boxplot | | ||
| rx | 2 | number | The [x-axis radius](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/rx) for the box | | ||
| ry | 2 | number | The [y-axis radius](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/ry) for the box | | ||
| container | false | boolean | Set to true and add `containerProps = {{ /** */}}` to add events to each boxplot group | | ||
| maxProps | {} | object | Props passed to target the `line` shape for the maximum | | ||
| minProps | {} | object | Props passed to target the `line` shape for the minimum | | ||
| medianProps | {} | object | Props passed to target the `line` shape for the median| | ||
| boxProps | {} | object | Props passed to target the `rect` shape for the box | | ||
| containerProps | {} | object | Props passed to add events over each boxplot group (requires `container={true}`) | | ||
## API | ||
<h3 id="boxplot-"><BoxPlot /></h3> | ||
<a id="#BoxPlot__boxProps" name="BoxPlot__boxProps" href="#BoxPlot__boxProps">#</a> *BoxPlot*.**boxProps**<object> <table><tr><td><strong>Default</strong></td><td>{}</td></td></table> | ||
<a id="#BoxPlot__boxWidth" name="BoxPlot__boxWidth" href="#BoxPlot__boxWidth">#</a> *BoxPlot*.**boxWidth**<number> | ||
<a id="#BoxPlot__children" name="BoxPlot__children" href="#BoxPlot__children">#</a> *BoxPlot*.**children**<func> | ||
<a id="#BoxPlot__className" name="BoxPlot__className" href="#BoxPlot__className">#</a> *BoxPlot*.**className**<string> | ||
<a id="#BoxPlot__container" name="BoxPlot__container" href="#BoxPlot__container">#</a> *BoxPlot*.**container**<bool> <table><tr><td><strong>Default</strong></td><td>false</td></td></table> | ||
<a id="#BoxPlot__containerProps" name="BoxPlot__containerProps" href="#BoxPlot__containerProps">#</a> *BoxPlot*.**containerProps**<object> <table><tr><td><strong>Default</strong></td><td>{}</td></td></table> | ||
<a id="#BoxPlot__fill" name="BoxPlot__fill" href="#BoxPlot__fill">#</a> *BoxPlot*.**fill**<string> | ||
<a id="#BoxPlot__fillOpacity" name="BoxPlot__fillOpacity" href="#BoxPlot__fillOpacity">#</a> *BoxPlot*.**fillOpacity**<union(number|string)> | ||
<a id="#BoxPlot__firstQuartile" name="BoxPlot__firstQuartile" href="#BoxPlot__firstQuartile">#</a> *BoxPlot*.**firstQuartile**<number> | ||
<a id="#BoxPlot__horizontal" name="BoxPlot__horizontal" href="#BoxPlot__horizontal">#</a> *BoxPlot*.**horizontal**<bool> | ||
<a id="#BoxPlot__left" name="BoxPlot__left" href="#BoxPlot__left">#</a> *BoxPlot*.**left**<number> <table><tr><td><strong>Default</strong></td><td>0</td></td></table> | ||
<a id="#BoxPlot__max" name="BoxPlot__max" href="#BoxPlot__max">#</a> *BoxPlot*.**max**<number> | ||
<a id="#BoxPlot__maxProps" name="BoxPlot__maxProps" href="#BoxPlot__maxProps">#</a> *BoxPlot*.**maxProps**<object> <table><tr><td><strong>Default</strong></td><td>{}</td></td></table> | ||
<a id="#BoxPlot__median" name="BoxPlot__median" href="#BoxPlot__median">#</a> *BoxPlot*.**median**<number> | ||
<a id="#BoxPlot__medianProps" name="BoxPlot__medianProps" href="#BoxPlot__medianProps">#</a> *BoxPlot*.**medianProps**<object> <table><tr><td><strong>Default</strong></td><td>{}</td></td></table> | ||
<a id="#BoxPlot__min" name="BoxPlot__min" href="#BoxPlot__min">#</a> *BoxPlot*.**min**<number> | ||
<a id="#BoxPlot__minProps" name="BoxPlot__minProps" href="#BoxPlot__minProps">#</a> *BoxPlot*.**minProps**<object> <table><tr><td><strong>Default</strong></td><td>{}</td></td></table> | ||
<a id="#BoxPlot__outlierProps" name="BoxPlot__outlierProps" href="#BoxPlot__outlierProps">#</a> *BoxPlot*.**outlierProps**<object> <table><tr><td><strong>Default</strong></td><td>{}</td></td></table> | ||
<a id="#BoxPlot__outliers" name="BoxPlot__outliers" href="#BoxPlot__outliers">#</a> *BoxPlot*.**outliers**<array> <table><tr><td><strong>Default</strong></td><td>[]</td></td></table> | ||
<a id="#BoxPlot__rx" name="BoxPlot__rx" href="#BoxPlot__rx">#</a> *BoxPlot*.**rx**<number> <table><tr><td><strong>Default</strong></td><td>2</td></td></table> | ||
<a id="#BoxPlot__ry" name="BoxPlot__ry" href="#BoxPlot__ry">#</a> *BoxPlot*.**ry**<number> <table><tr><td><strong>Default</strong></td><td>2</td></td></table> | ||
<a id="#BoxPlot__stroke" name="BoxPlot__stroke" href="#BoxPlot__stroke">#</a> *BoxPlot*.**stroke**<string> | ||
<a id="#BoxPlot__strokeWidth" name="BoxPlot__strokeWidth" href="#BoxPlot__strokeWidth">#</a> *BoxPlot*.**strokeWidth**<union(number|string)> | ||
<a id="#BoxPlot__thirdQuartile" name="BoxPlot__thirdQuartile" href="#BoxPlot__thirdQuartile">#</a> *BoxPlot*.**thirdQuartile**<number> | ||
<a id="#BoxPlot__top" name="BoxPlot__top" href="#BoxPlot__top">#</a> *BoxPlot*.**top**<number> <table><tr><td><strong>Default</strong></td><td>0</td></td></table> | ||
<a id="#BoxPlot__valueScale" name="BoxPlot__valueScale" href="#BoxPlot__valueScale">#</a> *BoxPlot*.**valueScale**<func> | ||
<h3 id="violinplot-"><ViolinPlot /></h3> | ||
<a id="#ViolinPlot__children" name="ViolinPlot__children" href="#ViolinPlot__children">#</a> *ViolinPlot*.**children**<func> | ||
<a id="#ViolinPlot__className" name="ViolinPlot__className" href="#ViolinPlot__className">#</a> *ViolinPlot*.**className**<string> | ||
<a id="#ViolinPlot__count" name="ViolinPlot__count" href="#ViolinPlot__count">#</a> *ViolinPlot*.**count**<func> <table><tr><td><strong>Default</strong></td><td>d => d.count</td></td></table> | ||
<a id="#ViolinPlot__data" name="ViolinPlot__data" href="#ViolinPlot__data">#</a> *ViolinPlot*.**data**<array> `required` | ||
<a id="#ViolinPlot__horizontal" name="ViolinPlot__horizontal" href="#ViolinPlot__horizontal">#</a> *ViolinPlot*.**horizontal**<bool> | ||
<a id="#ViolinPlot__left" name="ViolinPlot__left" href="#ViolinPlot__left">#</a> *ViolinPlot*.**left**<number> <table><tr><td><strong>Default</strong></td><td>0</td></td></table> | ||
<a id="#ViolinPlot__top" name="ViolinPlot__top" href="#ViolinPlot__top">#</a> *ViolinPlot*.**top**<number> <table><tr><td><strong>Default</strong></td><td>0</td></td></table> | ||
<a id="#ViolinPlot__value" name="ViolinPlot__value" href="#ViolinPlot__value">#</a> *ViolinPlot*.**value**<func> <table><tr><td><strong>Default</strong></td><td>d => d.value</td></td></table> | ||
<a id="#ViolinPlot__valueScale" name="ViolinPlot__valueScale" href="#ViolinPlot__valueScale">#</a> *ViolinPlot*.**valueScale**<func> | ||
<a id="#ViolinPlot__width" name="ViolinPlot__width" href="#ViolinPlot__width">#</a> *ViolinPlot*.**width**<number> |
45232
105
+ Added@vx/group@0.0.183(transitive)
- Removed@vx/group@0.0.182(transitive)
Updated@vx/group@0.0.183