Skip to content

Commit

Permalink
Merge pull request #72 from sgratzl/release/v4.2.1
Browse files Browse the repository at this point in the history
Release v4.2.1
  • Loading branch information
sgratzl authored Jul 4, 2023
2 parents ecf7442 + 26d2cff commit d854249
Show file tree
Hide file tree
Showing 73 changed files with 4,211 additions and 3,609 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,9 @@ jobs:
- run: yarn build
- run: yarn lint
- run: yarn test
- run: yarn samples
- uses: actions/upload-artifact@v2
if: failure()
with:
name: diff outputs
path: src/**/__diff_output__/*.png
- run: yarn docs:build
43 changes: 43 additions & 0 deletions .github/workflows/deploy_website.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
name: Deploy Website
on:
workflow_dispatch: {}
push:
branches:
- main
jobs:
deploy:
runs-on: ubuntu-latest
permissions:
pages: write
id-token: write
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
steps:
- uses: actions/checkout@v3
with:
fetch-depth: 0
- uses: actions/setup-node@v3
with:
node-version: 16
cache: npm
- run: npm i -g yarn
- run: yarn config set checksumBehavior ignore
- name: Cache Node.js modules
uses: actions/cache@v3
with:
path: |
./.yarn/cache
./.yarn/unplugged
key: ${{ runner.os }}-yarn2-v5-${{ hashFiles('**/yarn.lock') }}
restore-keys: |
${{ runner.os }}-yarn2-v5
- run: yarn install
- run: yarn docs:build
- uses: actions/configure-pages@v2
- uses: actions/upload-pages-artifact@v1
with:
path: docs/.vitepress/dist
- name: Deploy
id: deployment
uses: actions/deploy-pages@v1
6 changes: 4 additions & 2 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,11 @@ npm-debug.log*

*.tgz
/.vscode/extensions.json
/docs
*.tsbuildinfo
.eslintcache
__diff_output__

/samples/type_test.js
docs/.vitepress/dist
docs/.vitepress/cache
docs/.vitepress/config.ts.timestamp*
docs/api/
7 changes: 5 additions & 2 deletions .prettierignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,10 @@
/.yarnrc.yml
/.yarn
/build
/docs
/docs/.vitepress/cache
/docs/.vitepress/dist
/docs/.vitepress/config.ts.timestamp*
/docs/api
/coverage
/.gitattributes
/.gitignore
Expand All @@ -14,4 +17,4 @@
*.tgz
*.tsbuildinfo
.eslintcache
/samples/type_test.js
.nojekyll
1 change: 0 additions & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
"[yaml]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"eslint.packageManager": "yarn",
"npm.packageManager": "yarn",
"eslint.nodePath": ".yarn/sdks",
"prettier.prettierPath": ".yarn/sdks/prettier/index.js",
Expand Down
559 changes: 280 additions & 279 deletions .yarn/releases/yarn-3.5.0.cjs → .yarn/releases/yarn-3.6.1.cjs

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion .yarnrc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,4 @@ packageExtensions:
dependencies:
eslint-import-resolver-node: "*"

yarnPath: .yarn/releases/yarn-3.5.0.cjs
yarnPath: .yarn/releases/yarn-3.6.1.cjs
30 changes: 15 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,27 +7,15 @@ Chart.js module for charting box and violin plots. This is a maintained fork of
![Box Plot](https://user-images.githubusercontent.com/4129778/42724341-9a6ec554-8770-11e8-99b5-626e34dafdb3.png)
![Violin Plot](https://user-images.githubusercontent.com/4129778/42724342-9a8dbb58-8770-11e8-9a30-3e69d07d3b79.png)

## Related Plugins

Check out also my other chart.js plugins:

- [chartjs-chart-error-bars](https://github.com/sgratzl/chartjs-chart-error-bars) for rendering errors bars to bars and line charts
- [chartjs-chart-geo](https://github.com/sgratzl/chartjs-chart-geo) for rendering map, bubble maps, and choropleth charts
- [chartjs-chart-graph](https://github.com/sgratzl/chartjs-chart-graph) for rendering graphs, trees, and networks
- [chartjs-chart-pcp](https://github.com/sgratzl/chartjs-chart-pcp) for rendering parallel coordinate plots
- [chartjs-chart-venn](https://github.com/sgratzl/chartjs-chart-venn) for rendering venn and euler diagrams
- [chartjs-chart-wordcloud](https://github.com/sgratzl/chartjs-chart-wordcloud) for rendering word clouds
- [chartjs-plugin-hierarchical](https://github.com/sgratzl/chartjs-plugin-hierarchical) for rendering hierarchical categorical axes which can be expanded and collapsed

## Install

```bash
npm install --save chart.js @sgratzl/chartjs-chart-boxplot
npm install chart.js @sgratzl/chartjs-chart-boxplot
```

## Usage

see [Samples](https://github.com/sgratzl/chartjs-chart-box-and-violin-plot/tree/main/samples) on Github
see [Examples](https://sgratzl.com/chartjs-chart-boxplot/examples/)

and [![Open in CodePen][codepen]](https://codepen.io/sgratzl/pen/QxoLoY)

Expand Down Expand Up @@ -76,7 +64,7 @@ interface ITooltipItem {
}
```

### ESM and Tree Shaking
## ESM and Tree Shaking

The ESM build of the library supports tree shaking thus having no side effects. As a consequence the chart.js library won't be automatically manipulated nor new controllers automatically registered. One has to manually import and register them.

Expand Down Expand Up @@ -106,6 +94,18 @@ new BoxPlotChart(ctx, {
});
```

## Related Plugins

Check out also my other chart.js plugins:

- [chartjs-chart-error-bars](https://github.com/sgratzl/chartjs-chart-error-bars) for rendering errors bars to bars and line charts
- [chartjs-chart-geo](https://github.com/sgratzl/chartjs-chart-geo) for rendering map, bubble maps, and choropleth charts
- [chartjs-chart-graph](https://github.com/sgratzl/chartjs-chart-graph) for rendering graphs, trees, and networks
- [chartjs-chart-pcp](https://github.com/sgratzl/chartjs-chart-pcp) for rendering parallel coordinate plots
- [chartjs-chart-venn](https://github.com/sgratzl/chartjs-chart-venn) for rendering venn and euler diagrams
- [chartjs-chart-wordcloud](https://github.com/sgratzl/chartjs-chart-wordcloud) for rendering word clouds
- [chartjs-plugin-hierarchical](https://github.com/sgratzl/chartjs-plugin-hierarchical) for rendering hierarchical categorical axes which can be expanded and collapsed

## Development Environment

```sh
Expand Down
64 changes: 64 additions & 0 deletions docs/.vitepress/config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
import { defineConfig } from 'vitepress';
import { name, description, repository, license, author } from '../../package.json';
import typedocSidebar from '../api/typedoc-sidebar.json';

const cleanName = name.replace('@sgratzl/', '');

// https://vitepress.dev/reference/site-config
export default defineConfig({
title: cleanName,
description,
base: `/${cleanName}/`,
useWebFonts: false,
themeConfig: {
// https://vitepress.dev/reference/default-theme-config
nav: [
{ text: 'Home', link: '/' },
{ text: 'Getting Started', link: '/getting-started' },
{ text: 'Examples', link: '/examples/' },
{ text: 'API', link: '/api/' },
{ text: 'Related Plugins', link: '/related' },
],

sidebar: [
{
text: 'Examples',
items: [
{ text: 'Basic', link: '/examples/' },
{ text: 'Data Limits', link: '/examples/datalimits' },
{ text: 'Data Structures', link: '/examples/datastructures' },
{ text: 'Quantile Computation', link: '/examples/fivenum' },
{ text: 'Horizontal Plots', link: '/examples/horizontal' },
{ text: 'Large Numbers', link: '/examples/large_number' },
{ text: 'Logarithmic Scale', link: '/examples/logarithm' },
{ text: 'Hybrid Chart', link: '/examples/hybrid' },
{ text: 'Data Points', link: '/examples/items' },
{ text: 'Styling', link: '/examples/styling' },
],
},
{
text: 'API',
collapsed: true,
items: typedocSidebar,
},
],

socialLinks: [{ icon: 'github', link: repository.url.replace('.git', '') }],

footer: {
message: `Released under the <a href="${repository.url.replace(
'.git',
''
)}/tree/main/LICENSE">${license} license</a>.`,
copyright: `Copyright © 2019-present <a href="${author.url}">${author.name}</a>`,
},

editLink: {
pattern: `${repository.url.replace('.git', '')}/edit/main/docs/:path`,
},

search: {
provider: 'local',
},
},
});
56 changes: 56 additions & 0 deletions docs/.vitepress/theme/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
import Theme from 'vitepress/theme';
import { createTypedChart } from 'vue-chartjs';
import {
LinearScale,
CategoryScale,
LogarithmicScale,
Tooltip,
Title,
Legend,
Colors,
BarElement,
LineElement,
PointElement,
BarController,
LineController,
} from 'chart.js';
import { BoxAndWiskers, BoxPlotController, Violin, ViolinController } from '../../../src';

export default {
...Theme,
enhanceApp({ app }) {
app.component(
'BoxplotChart',
createTypedChart('boxplot', [
LinearScale,
CategoryScale,
LogarithmicScale,
BoxAndWiskers,
BoxPlotController,
Tooltip,
Legend,
Colors,
Title,
BarElement,
LineElement,
PointElement,
BarController,
LineController,
])
);
app.component(
'ViolinChart',
createTypedChart('violin', [
LinearScale,
CategoryScale,
LogarithmicScale,
Violin,
ViolinController,
Tooltip,
Legend,
Colors,
Title,
])
);
},
};
40 changes: 40 additions & 0 deletions docs/examples/boxplot.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import type { ChartConfiguration } from 'chart.js';
import type {} from '../../src';

// #region data
function randomValues(count: number, min: number, max: number, extra: number[] = []): number[] {
const delta = max - min;
return [...Array.from({ length: count }).map(() => Math.random() * delta + min), ...extra];
}

export const data: ChartConfiguration<'boxplot'>['data'] = {
labels: ['A', 'B', 'C', 'D'],
datasets: [
{
label: 'Dataset 1',
data: [
randomValues(100, 0, 100),
randomValues(100, 0, 20, [110]),
randomValues(100, 20, 70),
// empty data
[],
],
},
{
label: 'Dataset 2',
data: [
randomValues(100, 60, 100, [5, 10]),
randomValues(100, 0, 100),
randomValues(100, 0, 20),
randomValues(100, 20, 40),
],
},
],
};
// #endregion data
// #region config
export const config: ChartConfiguration<'boxplot'> = {
type: 'boxplot',
data,
};
// #endregion config
66 changes: 66 additions & 0 deletions docs/examples/datalimits.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
---
title: Data Limits
---

# Data Limits

You can customize the scale limit the the minimal and maximal values independently. There are three common choices:

- data limits (default) ... the minimal and maximal values of the data are the scale limits
- whiskers ... the minimal and maximal values are the whisker endpoints
- box ... the minimal and maximal values are the box endpoints q1 (25% quantile) and q3 (75% quantile)

<script setup>
import {minmax, box, whiskers} from './datalimits';
</script>

## Data Limits

<BoxplotChart
:options="minmax.options"
:data="minmax.data"
/>

### Code

:::code-group

<<< ./datalimits.ts#minmax [config]

<<< ./boxplot.ts#data [data]

:::

## Whiskers

<BoxplotChart
:options="whiskers.options"
:data="whiskers.data"
/>

### Code

:::code-group

<<< ./datalimits.ts#whiskers [config]

<<< ./boxplot.ts#data [data]

:::

## Box

<BoxplotChart
:options="box.options"
:data="box.data"
/>

### Code

:::code-group

<<< ./datalimits.ts#box [config]

<<< ./boxplot.ts#data [data]

:::
Loading

0 comments on commit d854249

Please sign in to comment.