/data-viz-echarts-panel

Echarts panel for grafana

Primary LanguageTypeScriptApache License 2.0Apache-2.0

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