{"id":20826534,"url":"https://github.com/upsetjs/upsetjs","last_synced_at":"2025-04-07T07:07:15.537Z","repository":{"id":37746910,"uuid":"243861761","full_name":"upsetjs/upsetjs","owner":"upsetjs","description":"😠 UpSet.js - a set visualization library for rendering UpSet Plots (a JavaScript re-implementation of UpSet(R) by Lex et al), Euler Diagrams, Venn Diagrams, and Karnaugh Maps","archived":false,"fork":false,"pushed_at":"2023-05-08T04:20:36.000Z","size":13634,"stargazers_count":139,"open_issues_count":17,"forks_count":16,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-03-31T05:03:47.932Z","etag":null,"topics":["d3js","euler","euler-diagram","javascript","karnaugh-map","react","typescript","upset","upsetr","venn","venn-diagram","visualization"],"latest_commit_sha":null,"homepage":"https://upset.js.org","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/upsetjs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2020-02-28T21:59:22.000Z","updated_at":"2025-03-22T15:37:07.000Z","dependencies_parsed_at":"2023-02-18T14:15:58.858Z","dependency_job_id":"42b2c9f4-78e6-4b8f-9bf2-fc564403132c","html_url":"https://github.com/upsetjs/upsetjs","commit_stats":null,"previous_names":["sgratzl/upsetjs"],"tags_count":26,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upsetjs%2Fupsetjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upsetjs%2Fupsetjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upsetjs%2Fupsetjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upsetjs%2Fupsetjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/upsetjs","download_url":"https://codeload.github.com/upsetjs/upsetjs/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247608151,"owners_count":20965952,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["d3js","euler","euler-diagram","javascript","karnaugh-map","react","typescript","upset","upsetr","venn","venn-diagram","visualization"],"created_at":"2024-11-17T23:09:24.621Z","updated_at":"2025-04-07T07:07:15.499Z","avatar_url":"https://github.com/upsetjs.png","language":"TypeScript","readme":"# UpSet.js\n\n[![NPM Package][npm-image]][npm-url] [![Github Actions][github-actions-image]][github-actions-url]\n\nUpSet.js is a JavaScript re-implementation of [UpSetR](https://www.rdocumentation.org/packages/UpSetR/) which itself is based on [UpSet](http://vcg.github.io/upset/about/) to create interactive set visualizations for more than three sets. The core library is written in React but provides also bundle editions for plain JavaScript use. The `UpSetJS` React component is implemented as a pure functional component solely depending on the given properties.\n\n![interactions](https://user-images.githubusercontent.com/4129778/80863076-f0f8f380-8c79-11ea-8790-f6ad86738b28.png)\n\nMore details about UpSet.js can be found on the Medium article series about it:\n\n1. [UpSet.js — The UpSet.js Ecosystem](https://medium.com/@sgratzl/upset-js-the-upset-js-ecosystem-ab6692d2f34a?source=friends_link\u0026sk=6925bb1f754f4c480009d82720a796b9)\n1. [UpSet.js — JavaScript Tutorial](https://medium.com/@sgratzl/upset-js-javascript-tutorial-1b84bfd6896d?source=friends_link\u0026sk=964cb1a70e194ded26f31e371639c67e)\n1. [UpSet.js — Behind the (technical) Scenes](https://medium.com/@sgratzl/upset-js-behind-the-technical-scenes-6eb0c880a03e?source=friends_link\u0026sk=2e90d4b2e21a9f65e1d387985612dc2b)\n\nThis monorepo contains following packages:\n\n- [@upsetjs/model](https://github.com/upsetjs/upsetjs/tree/main/packages/model) the data model definition of UpSet.js\n  [![Open Docs][docs]](https://upset.js.org/api/model/modules.hml)\n\n- [@upsetjs/react](https://github.com/upsetjs/upsetjs/tree/main/packages/react) the main UpSet.js React component\n  [![Open Docs][docs]](https://upset.js.org/api/react/modules.hml)\n\n- [@upsetjs/math](https://github.com/upsetjs/upsetjs/tree/main/packages/math) utility package for computing stats\n\n- [@upsetjs/addons](https://github.com/upsetjs/upsetjs/tree/main/packages/addons) extensions to the React component for rendering boxplots\n  [![Open Docs][docs]](https://upset.js.org/api/addons/modules.hml)\n\n- [@upsetjs/bundle](https://github.com/upsetjs/upsetjs/tree/main/packages/bundle) zero dependency bundle of the react and addons component using Preact\n  [![Open Docs][docs]](https://upset.js.org/api/bundle/modules.hml)\n\n- [@upsetjs/plots](https://github.com/upsetjs/upsetjs/tree/main/packages/plots) VEGA plot helper to be linked with UpSet.js\n  [![Open Docs][docs]](https://upset.js.org/api/plots/modules.hml)\n\n- [@upsetjs/app](https://github.com/upsetjs/upsetjs/tree/main/packages/app) example application to explore datasets using UpSet.js with import and export features\n  [![Open Example][example]](https://upset.js.org/app)\n\n- [@upsetjs/vue](https://github.com/upsetjs/upsetjs/tree/main/packages/vue) vue wrapper based on the bundled version\n\nIn addition, there are the following sibling repositories and projects\n\n- [upsetjs_r](https://github.com/upsetjs/upsetjs_r) R HTMLWidget wrapper around UpSet.js\n  [![CRAN][cran-image]][cran-url] [![Open in Binder][binder]][binder-r-url] [![Open Docs][docs]][docs-r-url] [![Open example][example]][example-r-url]\n\n- [upsetjs_jupyter_widget](https://github.com/upsetjs/upsetjs_jupyter_widget) Jupyter Widget wrapper around UpSet.js\n  [![Open in NBViewer][nbviewer]][nbviewer-url] [![Open in Binder][binder]][binder-j-url] [![Open API Docs][docs]][docs-j-url] [![Open Example][example]][example-j-url]\n\n- [upsetjs_powerbi_visuals](https://upset.js.org/integrations/powerbi/) PowerBI Custom Visuals around UpSet.js\n- [upsetjs_tableau_extension](https://upset.js.org/integrations/tableau/) Tableau extension around UpSet.js\n- [upset-js](https://observablehq.com/@sgratzl/upset-js) Observable HQ wrapper around UpSet.js [![Open Example][example]][example-o-url]\n\n## Usage and Installation\n\n### React\n\n```sh\nnpm install @upsetjs/react react react-dom\n```\n\n```ts\nimport React from 'react';\nimport UpSetJS, { extractCombinations, ISetLike } from '@upsetjs/react';\n\nconst elems = [\n  { name: 'A', sets: ['S1', 'S2'] },\n  { name: 'B', sets: ['S1'] },\n  { name: 'C', sets: ['S2'] },\n  { name: 'D', sets: ['S1', 'S3'] },\n];\n\nconst { sets, combinations } = extractCombinations(elems);\n\n\u003cUpSetJS sets={sets} combinations={combinations} width={500} height={300} /\u003e;\n```\n\nwith stored selection\n\n```ts\nconst UpSetJSSelection = (props: any) =\u003e {\n  [selection, setSelection] = React.useState(null as ISetLike\u003cany\u003e | null);\n\n  return \u003cUpSetJS {...props} selection={selection} onHover={setSelection} /\u003e;\n};\n\n\u003cUpSetJSSelection sets={sets} combinations={combinations} width={500} height={300} /\u003e;\n```\n\n![simple](https://user-images.githubusercontent.com/4129778/79372711-4cc33d00-7f56-11ea-865e-e1f74261ccb2.png)\n\n### Bundled version\n\n```sh\nnpm install @upsetjs/bundle\n```\n\n```js\nimport { extractCombinations, render } from '@upsetjs/bundle';\n\nconst elems = [\n  { name: 'A', sets: ['S1', 'S2'] },\n  { name: 'B', sets: ['S1'] },\n  { name: 'C', sets: ['S2'] },\n  { name: 'D', sets: ['S1', 'S3'] },\n];\n\nconst { sets, combinations } = extractCombinations(elems);\n\nrender(document.body, { sets, combinations, width: 500, height: 300 });\n```\n\nwith stored selection\n\n```js\nlet selection = null;\n\nfunction onHover(set) {\n  selection = set;\n  rerender();\n}\n\nfunction rerender() {\n  const props = { sets, combinations, width: 500, height: 300, selection, onHover };\n  render(document.body, props);\n}\n\nrerender();\n```\n\n![simple](https://user-images.githubusercontent.com/4129778/79372711-4cc33d00-7f56-11ea-865e-e1f74261ccb2.png)\n\nsee also [![Open in CodePen][codepen]](https://codepen.io/sgratzl/pen/GRpoMZY)\n\n## Venn Diagrams\n\nFor comparison and convenience reasons UpSet.js also has a Venn Diagram component for rendering two or three sets.\n\n```ts\nimport React from 'react';\nimport { VennDiagram, extractSets, ISetLike } from '@upsetjs/react';\n\nconst elems = [\n  { name: 'A', sets: ['S1', 'S2'] },\n  { name: 'B', sets: ['S1'] },\n  { name: 'C', sets: ['S2'] },\n  { name: 'D', sets: ['S1', 'S3'] },\n];\n\nconst sets = extractSets(elems);\n\n\u003cVennDiagram sets={sets} width={500} height={300} /\u003e;\n```\n\nwith stored selection\n\n```ts\nconst VennDiagramSelection = (props: any) =\u003e {\n  [selection, setSelection] = React.useState(null as ISetLike\u003cany\u003e | null);\n\n  return \u003cVennDiagram {...props} selection={selection} onHover={setSelection} /\u003e;\n};\n\n\u003cVennDiagramSelection sets={sets} width={500} height={300} /\u003e;\n```\n\n![venn diagram](https://user-images.githubusercontent.com/4129778/84775176-2580fe80-afdf-11ea-80b6-7b7a45a32b72.png)\n\n```js\nimport { extractSets, renderVennDiagram } from '@upsetjs/bundle';\n\nconst elems = [\n  { name: 'A', sets: ['S1', 'S2'] },\n  { name: 'B', sets: ['S1'] },\n  { name: 'C', sets: ['S2'] },\n  { name: 'D', sets: ['S1', 'S3'] },\n];\n\nconst sets = extractSets(elems);\n\nrenderVennDiagram(document.body, { sets, width: 500, height: 300 });\n```\n\nwith stored selection\n\n```js\nlet selection = null;\n\nfunction onHover(set) {\n  selection = set;\n  rerender();\n}\n\nfunction rerender() {\n  const props = { sets, width: 500, height: 300, selection, onHover };\n  renderVennDiagram(document.body, props);\n}\n\nrerender();\n```\n\n## Karnaugh Maps\n\nUpSet.js also has a variant of a Karnaugh Map for rendering set intersections in a dense matrix way.\n\n```ts\nimport React from 'react';\nimport { KarnaughMap, extractSets, ISetLike } from '@upsetjs/react';\n\nconst elems = [\n  { name: 'A', sets: ['S1', 'S2'] },\n  { name: 'B', sets: ['S1'] },\n  { name: 'C', sets: ['S2'] },\n  { name: 'D', sets: ['S1', 'S3'] },\n];\n\nconst sets = extractSets(elems);\n\n\u003cKarnaughMap sets={sets} width={550} height={300} /\u003e;\n```\n\nwith stored selection\n\n```ts\nconst KarnaughMapSelection = (props: any) =\u003e {\n  [selection, setSelection] = React.useState(null as ISetLike\u003cany\u003e | null);\n\n  return \u003cKarnaughMap {...props} selection={selection} onHover={setSelection} /\u003e;\n};\n\n\u003cKarnaughMapSelection sets={sets} width={550} height={300} /\u003e;\n```\n\n```js\nimport { extractSets, renderKarnaughMap } from '@upsetjs/bundle';\n\nconst elems = [\n  { name: 'A', sets: ['S1', 'S2'] },\n  { name: 'B', sets: ['S1'] },\n  { name: 'C', sets: ['S2'] },\n  { name: 'D', sets: ['S1', 'S3'] },\n];\n\nconst sets = extractSets(elems);\n\nrenderKarnaughMap(document.body, { sets, width: 550, height: 300 });\n```\n\nwith stored selection\n\n```js\nlet selection = null;\n\nfunction onHover(set) {\n  selection = set;\n  rerender();\n}\n\nfunction rerender() {\n  const props = { sets, width: 550, height: 300, selection, onHover };\n  renderKarnaughMap(document.body, props);\n}\n\nrerender();\n```\n\n![Karnaugh Map](https://user-images.githubusercontent.com/4129778/85573750-75db0a80-b636-11ea-819c-8ee1525edab0.png)\n\n## Interactivity\n\nBy specifying `onHover` and `selection` UpSet.js is fully interactive. As an alternative there is also the `onClick` property.\n\n![interactions](https://user-images.githubusercontent.com/4129778/80863076-f0f8f380-8c79-11ea-8790-f6ad86738b28.png)\n\n## Queries\n\nSimilar to the original UpSetR, UpSet.js allows to specify queries by a set of elements which are then highlighted in the plot.\nThe first query is shown in full detail while others are shown using small indicators.\n\n```ts\nconst queries = [\n  { name: 'Q1', color: 'steelblue', elems: elems.filter(() =\u003e Math.random() \u003e 0.7) },\n  { name: 'Q2', color: 'red', elems: elems.filter(() =\u003e Math.random() \u003e 0.8) },\n];\n\nrender(document.body, { sets, width: 1000, height: 500, queries });\n```\n\n![queries](https://user-images.githubusercontent.com/4129778/80863309-a2e4ef80-8c7b-11ea-834d-9c5da34a386a.png)\n\nsee also [![Open in CodePen][codepen]](https://codepen.io/sgratzl/pen/BaNmpJq)\n\n## Addons\n\nSimilar to the original UpSet and UpSetR, `UpSet` allows to render boxplot for showing numerical aggregates of sets and set combinations.\n\n```ts\nimport { extractSets, render, boxplotAddon } from '@upsetjs/bundle';\n\nconst elems = [\n  { name: '1', sets: ['one', 'two', 'three'], value: Math.random() },\n  { name: '2', sets: ['one', 'two'], value: Math.random() },\n  { name: '3', sets: ['one'], value: Math.random() },\n  { name: '4', sets: ['two'], value: Math.random() },\n  { name: '5', sets: ['one', 'two', 'three'], value: Math.random() },\n  { name: '6', sets: ['three'], value: Math.random() },\n  { name: '7', sets: ['one', 'three'], value: Math.random() },\n  { name: '8', sets: ['one', 'three'], value: Math.random() },\n  { name: '9', sets: ['three'], value: Math.random() },\n  { name: '10', sets: ['two', 'three'], value: Math.random() },\n  { name: '11', sets: ['one'], value: Math.random() },\n  { name: '12', sets: ['one', 'three'], value: Math.random() },\n  { name: '13', sets: ['one', 'three'], value: Math.random() },\n];\nconst sets = extractSets(elems);\n\nrender(document.body, {\n  sets,\n  width: 500,\n  height: 300,\n  setAddons: [boxplotAddon('value', elems)],\n  combinationAddons: [boxplotAddon('value', elems, { orient: 'vertical' })],\n});\n```\n\n![addons](https://user-images.githubusercontent.com/4129778/79564225-85762a00-80ae-11ea-80ae-1d01a43ec45a.png)\n\n## Plots\n\nSimilar to the original UpSet and UpSetR, support plots showing histograms, scatterplots, bar charts, or pie charts of attributes of the elements can be created and linked.\n\nThe [@upsetjs/plots](https://github.com/upsetjs/upsetjs/tree/main/packages/plots) package contains wrappers around VEGA plots which support selection and queries, to be easily linked with UpSet.js plots.\n\n![plots](https://user-images.githubusercontent.com/4129778/84775584-b0fa8f80-afdf-11ea-9875-f4ae8b9baccb.png)\n\n## UpSet.js App\n\nThe UpSet.js App is an web application for exploring sets and set intersections. It is the counterpart to the original [UpSet](http://vcg.github.io/upset/about/) and [UpSet2](https://vdl.sci.utah.edu/upset2/). The app is deployed at [https://upset.js.org/app](https://upset.js.org/app).\n\n![upset_app1](https://user-images.githubusercontent.com/4129778/80863152-97dd8f80-8c7a-11ea-8677-c86598fc6161.png)\n\n### UpSetJS\n\nThe most relevant and required properties of the `UpSetJS` component are:\n\n```ts\n{\n  width: number;\n  height: number;\n\n  sets: ISet\u003cT\u003e[];\n  combinations?: ISetCombination\u003cT\u003e[] | GenerateCombinationOptions\u003cT\u003e;\n\n  selection?: ISetLike\u003cT\u003e | readonly T[] | null;\n\n  onHover?(selection: ISetLike\u003cT\u003e | null): void;\n  onClick?(selection: ISetLike\u003cT\u003e | null): void;\n\n  queries?: UpSetQuery\u003cT\u003e[];\n}\n```\n\n## Data\n\n`UpSetJS` requires sets and optionally combinations of sets as input. There are some utility function to help creating the required data structures:\n\n- `extractSets\u003cT extends { sets: string[] }\u003e(elements: readonly T[]): ISet\u003cT\u003e[]`\n  given an array of elements where each is having a property called `.sets` containing a list of set names in which this element is part of. e.g. `{ sets: ['Blue Hair', 'Female']}`. The return value is a list of sets in the required data structures and having a `.elems` with an array of the input elements.\n- `asSets\u003cT, S extends { name: string; elems: readonly T[] }\u003e(sets: readonly S[]): (S \u0026 ISet\u003cT\u003e)[]`\n  extends the given basic set objects (`name` and `elems`) with the required attributes for `UpSetJS`\n- `generateCombinations\u003cT\u003e(sets: ISets\u003cT\u003e, { type = 'intersection', min = 0, max = Infinity, empty = false } = {}): ISetCombination\u003cT\u003e[]`\n  one needs to generate the list of the combinations to show in case of customized sorting or filtering. This function takes the array of sets as input and computed all possible set intersections (aka. power set). The options allow to limit the generation to skip `empty` set combinations or enforce a minimum/maximum amount of sets in the set combinations. There are three types: `intersection` to generate set intersections, `union` for set unions, and `distinctIntersection` for set intersections that do not appear in any other set\n\n## Integration\n\n### Observable HQ\n\n[![Open Example][example]][example-o-url]\n\nA [ObservableHQ](https://observablehq.com/) wrapper is located at [upset-js](https://observablehq.com/@sgratzl/upset-js)\n\n```js\ndata = fetch(\n  'https://raw.githubusercontent.com/upsetjs/upsetjs/main/packages/bundle/example/got.json'\n).then(r =\u003e r.json())\n}\n```\n\n```js\nimport { extractSets, UpSetJSElement, generateIntersections } from '@sgratzl/upset-js';\n```\n\n```js\nsets = extractSets(data);\n```\n\n```js\nintersections = generateIntersections(sets);\n```\n\n```js\nviewof selection = UpSetJSElement(sets, intersections)\n```\n\n```js\nselection ? selection.elems.map((d) =\u003e d.name) : 'None';\n```\n\n[ObservableHQ](https://observablehq.com/@sgratzl/upset-js)\n\nAn advanced example showing all datasets from the live UpSet demo is located at [ObservableHQ](https://observablehq.com/@sgratzl/upset-observable-dataset-chooser-example)\n\n### R/RMarkdown/RShiny HTMLWidget\n\n[![CRAN][cran-image]][cran-url] [![Open in Binder][binder]][binder-r-url] [![open docs][docs]][docs-r-url] [![open example][example]][example-r-url]\n\nA R wrapper using [HTMLWidgets](https://www.htmlwidgets.org/) is located at [upset_r](https://github.com/upsetjs/upsetjs_r). The API follows the building pattern using the chaining operator `%\u003e%`.\nIn contrast to the original UpsetR implementation it focusses on the UpSet plot itself only. However it supports interactivity either using custom Shiny events or HTMLWidgets Crosstalk. See also Shiny examples.\n\n```R\n# CRAN version\ninstall.packages('upsetjs')\n# or\ndevtools::install_url(\"https://github.com/upsetjs/upsetjs_r/releases/latest/download/upsetjs.tar.gz\")\nlibrary(upsetjs)\n```\n\n```R\nlistInput \u003c- list(one = c(1, 2, 3, 5, 7, 8, 11, 12, 13), two = c(1, 2, 4, 5, 10), three = c(1, 5, 6, 7, 8, 9, 10, 12, 13))\nupsetjs() %\u003e% fromList(listInput) %\u003e% interactiveChart()\n```\n\n![List Input Example](https://user-images.githubusercontent.com/4129778/79375541-10dda700-7f59-11ea-933a-a3ffbca1bfd2.png)\n\nsee also [Basic.Rmd](https://github.com/upsetjs/upsetjs_r/main/vignettes/basic.Rmd)\n\n### Jupyter Widget\n\n[![Open in NBViewer][nbviewer]][nbviewer-url] [![Open in Binder][binder]][binder-j-url] [![Open API Docs][docs]][docs-j-url] [![Open Example][example]][example-j-url]\n\nA Jupyter Widget wrapper is located at [upsetjs_jupyter_widget](https://github.com/upsetjs/upsetjs_jupyter_widget).\n\n```bash\npip install upsetjs_jupyter_widget\njupyter labextension install @jupyter-widgets/jupyterlab-manager@3.0.0-alpha.0\n```\n\n```python\nfrom upsetjs_jupyter_widget import UpSetJSWidget\n```\n\n```python\nw = UpSetJSWidget[str]()\nw.from_dict(dict(one = ['a', 'b', 'c', 'e', 'g', 'h', 'k', 'l', 'm'], two = ['a', 'b', 'd', 'e', 'j'], three = ['a', 'e', 'f', 'g', 'h', 'i', 'j', 'l', 'm']))\nw\n```\n\n![upset_from_dict](https://user-images.githubusercontent.com/4129778/79368564-e4715d00-7f4f-11ea-92f5-23ee89b5332f.png)\n\n### PowerBI\n\nA [PowerBI Custom Visual](https://powerbi.microsoft.com/en-us/developers/custom-visualization/?cdn=disable) is located at [upsetjs_powerbi_visuals](https://upset.js.org/integrations/powerbi).\n\nDownload the latest package from [https://upset.js.org/integrations/powerbi/upsetjs.pbiviz](https://upset.js.org/integrations/powerbi/upsetjs.pbiviz) and install into your PowerBI environment.\n\n![UpSet.js Report](https://user-images.githubusercontent.com/4129778/80864985-9b771380-8c86-11ea-809c-a4473b32ed3b.png)\n\nAnother PowerBI Custom Visual for rendering Venn Diagrams can be downloaded from [https://upset.js.org/integrations/powerbi/upsetjs_venn.pbiviz](https://upset.js.org/integrations/powerbi/upsetjs_venn.pbiviz).\n\n![UpSet.js Report](https://user-images.githubusercontent.com/4129778/85765896-d6417900-b716-11ea-8b89-8ae01f6456a0.png)\n\n### Tableau\n\nA [Tableau](https://tableau.com) extension is located at [upsetjs_tableau_extension](https://upset.js.org/integrations/tableau).\n\n1. Download the extension description file at [upsetjs.trex](https://upset.js.org/integrations/tableau/upsetjs.trex)\n1. Create a new dashboard and show at least one sheet in the dashboard\n1. Follow [https://tableau.github.io/extensions-api/docs/trex_overview.html](https://tableau.github.io/extensions-api/docs/trex_overview.html) and choose the downloaded file\n1. Use the `configure` button or the `configure` menu entry to specify the input data\n\n![image](https://user-images.githubusercontent.com/4129778/80864773-04f62280-8c85-11ea-8db5-6df21683de0f.png)\n\n## Dev Environment\n\n```sh\nnpm i -g yarn\nyarn install\n```\n\n### Commands\n\n### Testing\n\n```sh\nyarn test\n```\n\n### Linting\n\n```sh\nyarn lint\n```\n\n### Building\n\n```sh\nyarn install\nyarn build\n```\n\n### Release\n\n[Release-it](https://github.com/release-it/release-it/) is used:\n\n```sh\nyarn release\n```\n\n### Release Policy\n\nto simplify this monorepo together with its siblings the following strategy for versioning is used:\nMajor and Minor versions should be in sync. Patch version are independent except the 10 potent.\nThus, a next unified patch release should be increased to the next 10 potent.\n\ne.g.,\n\n```\nupsetjs -\u003e 0.5.0, upsetjs_r -\u003e 0.5.0 good\nupsetjs -\u003e 0.5.2, upsetjs_r -\u003e 0.5.3 good since 0.5.02 ~ 0.5.03\nupsetjs -\u003e 0.5.10, upsetjs_r -\u003e 0.5.5 bad should be upsetjs_r -\u003e 0.5.10, too\n```\n\n## Privacy Policy\n\nUpSet.js is a client only library. The library and all of its integrations (such as `Ultimate UpSet Plot` and `Ultimate Venn Digramm` for PowerBI) don't track you or transfer your data or personal information to any server.\nThe uploaded data in the app (located at https://upset.js.org/app) are stored in your browser only using IndexedDB. The Tableau extension can run in a sandbox environment prohibiting any server requests.\nHowever, as soon as you export your session within the app (located at https://upset.js.org/app) to an external service (e.g., Codepen.io) your data will be transferred.\n\n## License / Terms of Service\n\n### Commercial license\n\nIf you want to use UpSet.js for a commercial application or in a commercial environment, the commercial license is the appropriate license. Contact [@sgratzl](mailto:sam@sgratzl.com) for details.\n\n### Open-source license\n\nThis library is released under the `GNU AGPLv3` version to be used for private and academic purposes.\nIn case of a commercial use, please get in touch regarding a commercial license.\n\n[npm-image]: https://badge.fury.io/js/%40upsetjs%2Freact.svg\n[npm-url]: https://npmjs.org/package/@upsetjs/react\n[github-actions-image]: https://github.com/upsetjs/upsetjs/workflows/ci/badge.svg\n[github-actions-url]: https://github.com/upsetjs/upsetjs/actions\n[codepen]: https://img.shields.io/badge/CodePen-open-blue?logo=codepen\n[codesandbox]: https://img.shields.io/badge/CodeSandbox-open-blue?logo=codesandbox\n[nbviewer]: https://img.shields.io/badge/NBViewer-open-blue?logo=jupyter\n[nbviewer-url]: https://nbviewer.jupyter.org/github/upsetjs/upsetjs_jupyter_widget/blob/main/examples/introduction.ipynb\n[binder]: https://mybinder.org/badge_logo.svg\n[binder-r-url]: https://mybinder.org/v2/gh/upsetjs/upsetjs_r/master?urlpath=rstudio\n[binder-j-url]: https://mybinder.org/v2/gh/upsetjs/upsetjs_jupyter_widget/master?urlpath=lab/tree/examples/introduction.ipynb\n[docs]: https://img.shields.io/badge/API-open-blue\n[docs-r-url]: https://upset.js.org/integrations/r/\n[docs-j-url]: https://upset.js.org/api/jupyter/\n[example]: https://img.shields.io/badge/Example-open-red\n[example-r-url]: https://upset.js.org/integrations/r/articles/basic\n[example-j-url]: https://upset.js.org/integrations/jupyter/\n[example-o-url]: https://observablehq.com/@sgratzl/upset-observable-example\n[cran-image]: https://img.shields.io/cran/v/upsetjs\n[cran-url]: https://www.rdocumentation.org/packages/upsetjs\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fupsetjs%2Fupsetjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fupsetjs%2Fupsetjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fupsetjs%2Fupsetjs/lists"}