Documentationbreadcrumb arrow Pluginsbreadcrumb arrow Business Chartsbreadcrumb arrow Featuresbreadcrumb arrow Library imports
Grafana Cloud Enterprise Open source

Library imports

Note

The Business Charts panel supports the npm library imports since version 6.0.0.

Since version 6.4.0 you can return import with options instead use setOption(options) method.

Additional NPM libraries can be imported to be used in Business Charts panel using import statement.

ecStat library

Additional libraries like ecStat can be loaded dynamically to provide additional functionality. In this example we use setOption(options) method in then method.

js 
const options = {};

/**
 * echarts-stat import
 */
import("https://esm.sh/echarts-stat@1.2.0").then(
  ({ default: ecStatImport }) => {
    context.echarts.registerTransform(ecStatImport.transform.regression);

    /**
     * setOption method use
     */
    context.panel.chart.setOption(options);
  }
);

Scatter type graph with imported ecStat library.

ecSimpleTransform library

For next example we use JSON API data source and data example from Apache ECharts website.

Code example for version 6.4.0 and above:

js 
/**
 * echarts-simple-transform import
 */
return import("https://esm.sh/@manufac/echarts-simple-transform@2.0.11").then(
  ({ default: ecSimpleTransform }) => {
    context.echarts.registerTransform(ecSimpleTransform.aggregate);

    /**
     * return options
     */
    return options;
  }
);

Boxplot type graph with imported ecSimpleTransform library.