We are happy to announce the release of Apache ECharts Panel 4.2.0 for Grafana. This maintenance release includes the following updates:
- Added the
EventBus
parameter to publish events. - Removed the panel padding, allowing you to use all of the panel space from corner to corner.
- Updated the default background to
transparent
for light and dark themes. - Updated the plugin to the latest Grafana 9.4.3 toolkit and workflows.
The plugin was updated in the Grafana Plugins catalog on March 8, 2023.
No Padding
The removal of the panel padding lets you use the panel space more effectively for displaying charts, maps, and graphics across the entire width and height of the panel.

Community Use cases
We are amazed by the everyday developments of the community that make use of the latest capabilities in Apache ECharts Panel for Grafana.
Dynamic toolbox
Our community member ftasso shared an extremely interesting use case that displays complex ECharts objects like a sunburst with the toolbox. It dynamically retrieves data and uses a variety of variables for chart generation.
loading...
Preserve the selected range on a visual map
Our community member Barryetter shared another use case that allows you to preserve the range slider settings of the visualMap
object after the dashboard refresh.
- Specify two dashboard variables. Constants are also fine but you need to hide them from the user. Name them
datarangeStart
anddatarangeEnd
and apply some initial values to them. - In the Apache EChart Panel code editor (before the
return
snippet), add an event handler for thedatarangeselected
event. Remove any other event handler to prevent creation of duplicate handlers.
loading...
- In the
visualMap
definition, set therange
property to the dashboard variables using thereplaceVariables
method as described in our documentation.
loading...
Create DOM (Document Object Model) Elements
You can add elements (buttons, checkboxes, dropdown boxes, etc.) to the DOM (Document Object Model) using echartsInstance
contributed by Lroy.

For example, you can add a button with an event handler.
loading...
Getting Started
You can install Apache ECharts Panel from the Grafana Plugins catalog or using the Grafana command line tool.
For the latter, please use the following command.
grafana-cli plugins install volkovlabs-echarts-panel
YouTube Tutorial
The Apache ECharts Panel plugin is a data visualization extension for Grafana that allows you to integrate charts and graphs from the popular Apache ECharts library into your Grafana dashboard.
One of the three plugins that completes Grafana is Apache ECharts Panel. With Dynamic Text, Data Manipulation, and Apache ECharts Panel you can create fully functional web applications meeting your needs and expectations.
Release Notes
Features / Enhancements
- Added
EventBus
to the available parameters for publishing events (#122). - Added compatibility with Grafana 9.3.6 (#132).
- Added compatibility with Grafana 9.4.3 (#142).
- Updated CI and release workflows (#134).
- Added
NoPadding
to remove extra padding around (#138). - Set the background color as transparent by default (#139).
- Added the Magic (JavaScript) Trio tutorial (#141).
Feedback
We're looking forward to hearing from you. You can use different ways to get in touch with us.
- Ask a question, request a new feature, or report an issue at GitHub issues.
- Subscribe to our YouTube Channel and leave your comments.
- Sponsor our open-source plugins for Grafana at GitHub Sponsor.
- Support our project by starring the repository.