Skip to main content

Apache ECharts Panel

The Apache ECharts plugin is a visualization panel for Grafana that allows you to incorporate the popular Apache ECharts library into your Grafana dashboard.

How to create modern dashboards in Grafana.

Apache ECharts is a free, powerful charting and visualization library with statistical capabilities. It is written in pure JavaScript and based on zrender.

Apache ECharts visualization panel offers an easy way of adding intuitive, interactive, and highly customizable charts into your Grafana dashboard.

Simply put, and to avoid confusion,

  • Apache ECharts library is the charting library.
  • Apache ECharts plugin (which is the same as the Apache ECharts visualization panel) brings the Apache ECharts library into the Grafana dashboard.

Requirements

  • Grafana 8.5+, Grafana 9.0+ is required.

Getting Started

Apache ECharts visualization panel can be installed from the Grafana Catalog or utilizing the Grafana command line tool.

For the latter, use the following command.

grafana-cli plugins install volkovlabs-echarts-panel

Highlights

  • Provides Monaco Code Editor for:
    • Working with Grafana data frames (JavaScript).
    • Updating chart configurations in JSON format.
    • Custom theme configuration.
  • Supports variables and location service to make Charts interactive.
  • Based on the ECharts 5.4.2.
  • Supports Light and Dark themes synchronized with Grafana Theme.
  • Supports SVG and Canvas renderers.
  • Includes USA and World GeoJSON maps. Additional maps can be loaded dynamically.
  • Includes Liquid Fill Chart, which is usually used to represent data in percentage.
  • Includes ECharts-GL, which provides 3D plots, globe visualization, and WebGL acceleration.
  • Includes ecStat, a statistical and data mining tool.
  • Supports Code Editor suggestions for Parameters and variables.
  • Supports Baidu, Gaode, and Google Maps using API. Requires to provide access key.
  • Supports real-time data updates using streaming Data Sources and Grafana Live.
  • Has 100+ ready-as-is examples at echarts.volkovlabs.io.

Documentation

SectionDescription
ECharts FunctionExplains how to configure the main Apache ECharts library function.
ExamplesExplains how to get started with ECharts Examples.
Release NotesStay up to date with the latest features and updates.

Features

SectionDescription
AnnotationsDemonstrates how to use annotations.
Data SourcesDemonstrates how to retrieve data from data sources.
Event HandlingDemonstrates how to react to the triggered events.
ECharts InstanceDemonstrates how to interact with ECharts container.
StreamingExplains how to configure Apache ECharts for real-time data updates using streaming Data Sources and Grafana Live.
Theme EditorDemonstrates how to use the theme editor.
TransformationsDemonstrates how to work with transformations.
VariablesDemonstrated how to replace Dashboard and Global variables.

Maps

SectionDescription
GeoJSONDemonstrates how to work with GeoJSON Maps.
BaiduDemonstrates how to work with Baidu Maps API.
GaodeDemonstrates how to work with Gaode Maps API.
GoogleDemonstrates how to work with Google Maps API.

Tutorials

SectionDescription
Directed GraphExplains how to build and visualize directed graphs.
PNG and SVG imagesExplains how to use images in various formats.
Statistical and Data MiningExplains how to use statistical and data mining library.

Feedback

We love to hear from you. There are various ways to get in touch with us.

  • Ask a question, request a new feature, and file a bug with GitHub issues.
  • Subscribe to our YouTube Channel and add a comment.
  • Sponsor our open-source plugins for Grafana with GitHub Sponsor.
  • Star the repository to show your support.

License

Apache License Version 2.0, see LICENSE.