@stanislav.domb/several-dimension-multi-line-chart

several-dimension-multi-line-chart

This is the "Several Dimension Multi Line Chart" Superset Chart Plugin.

Usage

To install Superset you can use this resurses:

https://preset.io/blog/building-custom-viz-plugins-in-superset-v2/
https://github.com/nielsen-oss/superset-viz-plugins/blob/master/plugins/plugin-chart-status/src/plugin/controlPanel.ts
https://www.youtube.com/watch?v=sS-P2OI0fgk

After creating the new plugin (folders and files), inside root directory:

npm i

To run the plugin in development mode (=rebuilding whenever changes are made), App starts on localhost port: http://localhost:9000/ Start the dev server with the following command:

npm start

To add the package to Superset, go to the superset-frontend subdirectory in your Superset source folder (assuming both the superset-plugin-several-dimension plugin and superset repos are in the same root directory) and run

npm i -S ../../several-dimension-multi-line-chart

After this edit the superset-frontend/src/visualizations/presets/MainPreset.js and make the following changes:

import { SeveralDimensionMultiLineChartPlugin } from 'several-dimension-multi-line-chart';

to import the plugin and later add the following to the array that's passed to the plugins property:

new SeveralDimensionMultiLineChartPlugin().configure({
    key: 'several-dimension-multi-line-chart',
    }),

After that the plugin should show up when you run Superset, e.g. the development server:

npm run dev-server

It's possible, to use your new plugin as additional package. And you can publish the plugin to the npm repo and for installing you should have it in package.json:

"@stanislav.domb/several-dimension-multi-line-chart": "^0.1.1",

Hint for plugin usage

• If you need an additional line on the chart add data to "METRICS"
• If you need an additional chart add data to "COLUMNS" (filtering works only by one column)
• Filter by date works as usual