Skip to main content

Data Sources

The Base64 Image/Video/Audio/PDF visualization panel takes data from the connected data source. You can use any suitable data source to retrieve the data in the Base64 format.

The quickest option to start is to use the Static data source. PostgreSQL is a great option as well.

Static Data Source​

You can use the Static data source to store any supported formats in Base64 on your Grafana dashboard.

Limitation

Static Data Source is an excellent solution for not huge sizes. If you get a 413 Request Entity Too Long error, the Grafana limit is reached. In this case, consider using a database/storage data source. PostgreSQL is a good choice.

Base64 panel allows to display images on Grafana dashboard.
Base64 panel allows to display images on Grafana dashboard.

PostgreSQL​

The data source should return encoded file content and may return format definition data:video/mp4;base64,ENCODED-CONTENT for media files.

SELECT
  concat(
    'data:video/mp4;base64,',
    encode(video, 'base64')
  ) as video
from
  videos
where
  name = 'flow';
Base64 panel allows to display media files on Grafana dashboard.
Base64 panel allows to display media files on Grafana dashboard.

PostgreSQL database has built-in functions to work with the Base64 format.

SELECT CONVERT_FROM (DECODE('SGVsbG8gV29ybGQh', 'BASE64'), 'UTF-8');
SELECT ENCODE (CONVERT_TO('Hello World!', 'UTF-8'), 'BASE64');

Load media files into the database​

Create tables to store images, video, and audio files.

postgres/data.sql
loading...

Load PDF, PNG, MP4, MP3, etc. files into a database using Node.js script.

postgres/load.ts
loading...