Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/marcusolsson/grafana-hourly-heatmap-panel
A panel plugin for Grafana to visualize hourly heatmaps.
https://github.com/marcusolsson/grafana-hourly-heatmap-panel
grafana grafana-plugin heatmap panel
Last synced: about 1 month ago
JSON representation
A panel plugin for Grafana to visualize hourly heatmaps.
- Host: GitHub
- URL: https://github.com/marcusolsson/grafana-hourly-heatmap-panel
- Owner: marcusolsson
- License: apache-2.0
- Created: 2020-05-25T18:26:34.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2023-01-27T03:53:23.000Z (almost 2 years ago)
- Last Synced: 2023-02-26T07:47:03.487Z (almost 2 years ago)
- Topics: grafana, grafana-plugin, heatmap, panel
- Language: TypeScript
- Homepage:
- Size: 3.33 MB
- Stars: 28
- Watchers: 2
- Forks: 13
- Open Issues: 15
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Hourly Heatmap for Grafana
[](https://github.com/marcusolsson/grafana-hourly-heatmap-panel/actions?query=workflow%3A%22CI%22)
[](https://github.com/marcusolsson/grafana-hourly-heatmap-panel/actions?query=workflow%3ARelease)
[](https://grafana.com/grafana/plugins/marcusolsson-hourly-heatmap-panel)
[](https://grafana.com/grafana/plugins/marcusolsson-hourly-heatmap-panel)
[](LICENSE)
[](https://twitter.com/marcusolsson)
> **Maintenance**: As I'm no longer working at Grafana Labs, nor am I using Grafana where I'm at now, **I'm no longer able to actively maintain this plugin**. I'm exploring ways to keep the project going. Check back here to stay updated!
A panel plugin for [Grafana](https://grafana.com) to visualize hourly heatmaps.
An hourly heatmap aggregates data into buckets by day and hour to analyze activity or traffic during the day.
## Motivation
The [carpet-plot](https://github.com/petrslavotinek/grafana-carpetplot) panel plugin is one of the most used plugins for Grafana. Unfortunately, it's no longer being actively maintained.
Grafana 7.0 introduced a new plugin architecture based on React. Instead of migrating the original plugin from Angular, this is completely rewritten from scratch, using inspiration from the original plugin.
## Configuration
This section lists the available configuration options for the JSON API data source.
### Panel options
#### Dimensions
| Option | Description |
|---------|-------------------------------------------------------------------------|
| _Time_ | Name of the field to use for time. Defaults to the first time field. |
| _Value_ | Name of the field to use for value. Defaults to the first number field. |
#### Display
| Option | Description |
|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| _Show cell border_ | Toggles a cell border to make it easier to distinguish cells with similar values |
| _Show tooltip_ | Toggles the tooltip. Due to the current tooltip implementation, this severely impacts performance and I recommend that you disable this for large time intervals. For more information, refer to [#12](https://github.com/marcusolsson/grafana-hourly-heatmap-panel/issues/12). |
| _From_ and _To_ | Lets you choose the hours to display. This can be used to set working hours, or to filter parts of the day with low traffic |
#### Legend
| Option | Description |
|------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------|
| _Show legend_ | Toggles the color spectrum |
| _Show value indicator_ | Toggles an indicator that shows the current value in the legend |
| _Gradient quality_ | Determines the quality of the color spectrum. Higher quality means more SVG elements being drawn. Reduce the quality if you experience degraded performance. |
### Field options
| Option | Description |
|------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| _Group by_ | Size of each bucket |
| _Calculation_ | Calculation to use for reducing data within a bucket |
| _Color palette_ | Colors to use for the heatmap. Select from any of the predefined color palettes, or select **Custom** to create your own. Select **Field options** to use the colors from the built-in **Color scheme** field option |
| _Invert color palette_ | Inverts the currently selected color palette |
| _Null value color_ | Color to display when a bucket contains no data as opposed to a data value of 0. |
## Troubleshooting
### Missing data
By default, data sources limits the number of data points to the width of the panel in pixels. If you're visualizing data over a long time, then you may need to adjust the **Max data points** under **Query options** in the query editor.
