Plugins 〉Echarts


Developer
bilibala


Sign up to receive occasional product news and updates:



This plugin has been deprecated as it is no longer maintained. Consider use of Apache ECharts panel as an alternative.
Panel
community

Echarts

  • Overview
  • Installation
  • Change log
  • Related content

Grafana Echarts Panel

release issues stars

Echarts panel for grafana 6.3+ & 7.0+, coding with react.

Code editor is attached in the edit panel to configure the option of Apache ECharts (incubating).

Support echarts-wordcloud, echarts-liquidfill and echarts-gl.

screenshot

How Use

  1. Download the packaged plugin.
  2. Or clone this repo and run yarn build.
  3. Move folder to "/grafana_path/data/plugins".
  4. Restart grafana.

Tips

  1. Echarts option in the edit panel will execute when the data from grafana is refreshed, so you should avoid side effects or ensure that the side effects of the last execution can be cleared.
function (data, theme, echartsInstance, echarts) {
  echartsInstance.off('click') // clear side effects
  echartsInstance.on('click', () => {
    console.log('Click!');
  })
  return {...}
}
  1. Add Map: clone repo, add YourMap.json to src/map and run yarn build, panel will auto register it(echarts.registerMap('YourMap', {...})).

Custom

This plugin build with @grafana/toolkit. For more information about panels, refer to the documentation on Panels

  1. Install dependencies
yarn install
  1. Build plugin in development mode or run in watch mode
yarn dev

or

yarn watch
  1. Build plugin in production mode
yarn build

Learn more

Installing Echarts on Grafana Cloud:

For more information, visit the docs on plugin installation.

Change Log

All notable changes to this project will be documented in this file.

v1.0.0

Initial Release