Plugins 〉Base64 Image/Video/Audio/PDF


Developer
Volkov Labs


Sign up to receive occasional product news and updates:



Panel
community

Base64 Image/Video/Audio/PDF

  • Overview
  • Installation
  • Change log
  • Related content

Base64 Image/Video/Audio/PDF panel for Grafana

Image Panel

Grafana CI E2E codecov CodeQL

Introduction

Base64 Image/Video/Audio/PDF Panel is a Grafana plugin that renders PNG, JPG, GIF, MP4, WEBM, MP3, OGG, and PDF files encoded in the Base64 format.

Images, PDFs, Video, Live Camera Feed on Grafana Dashboard! You will need Base64 Image/PDF Plugin

Requirements

The Base64 Image/Video/Audio/PDF Panel version requirements for Grafana are as follows:

  • Version 4.X requires Grafana 9 or Grafana 10.
  • Version 3.X requires Grafana 8.5 or Grafana 9.
  • Version 2.X requires Grafana 8.
  • Version 1.X requires Grafana 7.1.

Getting Started

You can install Base64 Image/Video/Audio/PDF 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-image-panel

Highlights

  • The returned value can include base64 encoded content with or without a specified definition. The formats for the definition can look like data:image/jpg;base64,ENCODED-CONTENT or data:application/pdf;base64,ENCODED-CONTENT.
  • The file type is automatically determined based on the first Base64 symbol if no definition is provided.
  • If the data source returns more than one field of the string type, you can select the Field Name in the panel's display options.
  • You can fit image dimensions to the panel size, keep the original values, or adjust dimensions based on the manually supplied values.
  • Allows adding a URL with a title to navigate to other dashboards when clicking the image. URL supports dashboard variables.
  • Support for MP4 and WEBM video files with the definitions (data:video/mp4;base64,ENCODED-CONTENT and data:video/webm;base64,ENCODED-CONTENT)
  • Support for MP3 and OGG audio files with the efinitions (data:audio/mp3;base64,ENCODED-CONTENT and data:audio/ogg;base64,ENCODED-CONTENT)
  • Provides a toolbar to download, zoom, and navigate between multiple images.

Documentation

SectionDescription
Supported formatsExplains what formats are supported and how to display media files.
FeaturesDemonstrates panel capabilities.
Release NotesStay up to date with the latest features and updates.

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.

License

Apache License Version 2.0, see LICENSE.

Installing Base64 Image/Video/Audio/PDF on Grafana Cloud:

For more information, visit the docs on plugin installation.

Changelog

4.2.0 (2024-02-22)

Features / Enhancements

  • Update ESLint configuration and refactoring (#92)
  • Update dependencies and Actions (#94)
  • Add infinity play option (#93)

4.1.0 (2023-10-29)

Features / Enhancements

  • Update ESLint configuration (#84)
  • Add Image Scale Algorithm option (#89)
  • Update to Plugin Tools 2.1.1 (#90)
  • Use Grafana Access Policy to sign plugin (#90)
  • Update to Grafana 10.1.5 (#90)

4.0.0 (2023-06-26)

Breaking changes

  • Requires Grafana 9 and Grafana 10

Features / Enhancements

  • Add pan and pinch zooming option (#78)
  • Move pan pinch buttons to the toolbar (#79)
  • Update to Grafana 10.0.0 (#80)
  • Add description label (#82)
  • Remove Grafana 8.5 support (#83)

3.6.0 (2023-06-06)

Features / Enhancements

  • Update to Grafana 9.5.2 (#70)
  • Add E2E Cypress testing (#71)
  • Migrate to Plugin Tools 1.5.2 (#72, #73)
  • Update to Node 18 (#72)
  • Increase Test Coverage (#72)
  • Tested with Grafana 10 Preview (#74)
  • Add Toolbar to Download, Zoom and Navigation between images (#75, #76, #77)

3.5.0 (2023-03-07)

Features / Enhancements

  • Update CI and Release workflows (#64)
  • Update to Grafana 9.4.3 (#65)
  • Set NoPadding to use panel corner to corner (#66)

3.4.0 (2023-01-08) "New Year" edition

Features / Enhancements

  • Update to Grafana 9.3.2 (#60)
  • Add Documentation links (#61)
  • Update README and documentation (#62)

3.3.0 (2022-10-30) "Halloween" edition

Features / Enhancements

  • Support for sanitized variables in URL field (#53)
  • Update CI to Node 16 and Synchronize with Release workflow (#55)
  • Update to Grafana 9.2.2 (#56)

3.2.0 (2022-10-05)

Features / Enhancements

  • Update to Grafana 9.1.4 (#47)
  • Add Compatibility Check Workflow (#48)
  • Add option to disable PDF Toolbar (#50)
  • Update to Grafana 9.1.7 (#51)

3.1.0 (2022-08-13)

Features / Enhancements

  • Update README and Provisioning dashboards (#43)
  • Add YouTube video in README (#44)
  • Rebuild based on 9.0.7 (#45)
  • Update Grafana Marketplace image (#46)

3.0.0 (2022-06-16)

Breaking changes

  • Requires Grafana 8.5+ and 9.0+

Features / Enhancements

  • Rebuild based on 9.0.0-beta3 (#36)
  • Update PDF loader to start in Docker (#38)
  • Support short Video encoded using Base64 (#39)
  • Support MP3, OGG Audio playback in Base64 (#40)
  • Add Options for Video/Audio Controls and Auto Play (#41)
  • Rebuild based on 9.0.0 (#42)

2.6.0 (2022-04-26)

Features / Enhancements

  • Rebuild using 8.3.6 (#32)
  • Rebuild using 8.4.0 and use PluginCheck v2 (#33)
  • Rebuild using 8.4.3 (#34)
  • Based on Grafana 8.5.0 (#35)

2.5.0 (2022-01-24)

Features / Enhancements

  • Update README to add Grafana Marketplace (#29)
  • Rebuild using 8.3.4 (#28)

2.4.0 (2021-12-16)

Features / Enhancements

  • Upgrade to Grafana 8.2.5 (#22)
  • Upgrade to Grafana 8.3.0 (#23)
  • Update to Grafana 8.3.2 (#24)
  • Update Components naming (#25)
  • Supporting PDF documents more than 2Mb size (#26)

2.3.1 (2021-11-09)

Features / Enhancements

  • Add display:block to display href properly [https://github.com/grafana/grafana/issues/41445] (#21)

2.3.0 (2021-11-08)

Features / Enhancements

  • Navigate to another dashboard from image click (#19)
  • Upgrade to Grafana 8.2.3 (#20)

2.2.0 (2021-11-02)

Features / Enhancements

  • Upgrade to Grafana 8.1.5 (#16)
  • Upgrade to Grafana 8.2.0 (#17)
  • Upgrade to Grafana 8.2.2 (#18)

2.1.1 (2021-08-18)

Features / Enhancements

  • Add Radio to select Image Size modes (#14)

2.1.0 (2021-08-12)

Features / Enhancements

  • Update README (#10)
  • Upgrade to Grafana 8.1.1 (#12)
  • Add Options and Fields to resize an image (#13)

2.0.0 (2021-06-19)

Breaking changes

  • Supports Grafana 8.0+, for Grafana 7.X use version 1.0.1 or 1.1.0

Features / Enhancements

  • Based on Grafana 8.0.2 (#9)

1.1.0 (2021-06-19)

Features / Enhancements

  • Display base64 image with header (#7)
  • Display base64 Image from InfluxDB (#6)
  • Increase tests coverage (#4)

1.0.1 (2021-06-07)

Features / Enhancements

  • Add screenshots for Static and Redis data sources (#5)

1.0.0 (2021-06-07)

Features / Enhancements

  • Initial release based on Grafana 7.5.7
  • Supports PNG, JPG, GIF and PDF