tessl/npm-superset-ui--legacy-plugin-chart-parallel-coordinates
Superset Legacy Chart plugin providing parallel coordinates visualization for multi-dimensional data analysis
—
chart-plugin.mddocs/
Chart Plugin
The ParallelCoordinatesChartPlugin class is the main entry point for integrating the parallel coordinates visualization with Apache Superset. It extends the ChartPlugin base class and provides all necessary metadata and configuration.
Capabilities
ParallelCoordinatesChartPlugin Class
Main plugin class that handles registration and configuration of the parallel coordinates chart with Superset.
/**
* Parallel Coordinates Chart Plugin class for Superset integration
* Extends ChartPlugin from @superset-ui/core
*/
class ParallelCoordinatesChartPlugin extends ChartPlugin {
/**
* Creates a new ParallelCoordinatesChartPlugin instance
* Initializes with metadata, transformProps, controlPanel, and lazy-loaded chart component
*/
constructor();
}Usage Examples:
import ParallelCoordinatesChartPlugin from '@superset-ui/legacy-plugin-chart-parallel-coordinates';
// Basic plugin registration
const plugin = new ParallelCoordinatesChartPlugin();
plugin.configure({ key: 'parallel-coordinates' }).register();
// Registration with custom key
new ParallelCoordinatesChartPlugin()
.configure({ key: 'my-parallel-coords' })
.register();Plugin Configuration
The plugin is automatically configured with the following components:
Chart Metadata
/**
* Chart metadata defining plugin characteristics
*/
interface ChartMetadata {
/** Chart category in Superset UI */
category: string; // "Ranking"
/** External credits and attribution */
credits: string[];
/** Description of chart functionality */
description: string;
/** Example gallery images */
exampleGallery: Array<{ url: string }>;
/** Display name for the chart */
name: string; // "Parallel Coordinates"
/** Tags for categorization and search */
tags: string[]; // ["Coordinates", "Directional", "Legacy", "Relational"]
/** Thumbnail image for chart selection */
thumbnail: string;
/** Whether to use legacy Superset API */
useLegacyApi: boolean; // true
}Lazy Loading
The plugin uses dynamic imports to lazy-load the chart component:
/**
* Lazy loading configuration for chart component
* @returns Promise resolving to the React chart component
*/
loadChart: () => Promise<React.ComponentType>;The chart component is loaded from ./ReactParallelCoordinates when first needed, improving initial bundle size and loading performance.
Inherited Methods
From the ChartPlugin base class:
/**
* Configure the plugin with options
* @param config - Plugin configuration options
* @returns Plugin instance for method chaining
*/
configure(config: { key: string }): ParallelCoordinatesChartPlugin;
/**
* Register the plugin with Superset's chart registry
* @returns Plugin instance for method chaining
*/
register(): ParallelCoordinatesChartPlugin;Plugin Integration
Registration Process
- Import: Import the plugin class from the package
- Instantiate: Create a new instance with
new ParallelCoordinatesChartPlugin() - Configure: Set a unique key for the chart type
- Register: Register with Superset's plugin system
Chart Usage
Once registered, the chart can be used in Superset through:
- Explore Interface: Available in chart type selection dropdown
- SuperChart Component: Programmatic usage with the configured key
- Dashboard Integration: Add to dashboards through standard Superset workflow
Legacy API Support
This plugin uses Superset's legacy API (useLegacyApi: true), which means:
- Compatible with older Superset installations
- Uses traditional query response format
- May require migration for newer Superset versions
- Designed for backwards compatibility with existing workflows
Install with Tessl CLI
npx tessl i tessl/npm-superset-ui--legacy-plugin-chart-parallel-coordinates