grafana/grafana-image-renderer

Support for coloured emoji w/ headless Chromium

b-neufeld opened this issue · 0 comments

What would you like to be added: Include a free and open-source coloured emoji font with grafana-image-renderer like Noto and make it the default emoji font.

Why is this needed: When grafana-image-renderer is running headless, the Chromium browser doesn't render emoji in colour - so stuff that looks great on Grafana looks sub-par after being run through grafana-image-renderer. Use cases include emoji in Grafana text boxes, axis labels, data labels, and more.

A kludgey workaround I'll share, with the caveat I am more of a hack than a programmer and parts of this solution are probably redundant or functionless... I map the .ttf to an existing fonts directory inside the image-renderer container. I then run fc-cache -fv (reference) to build the font information cache files.

My Docker Compose file looks like this:

services:
  grafana-image-renderer:
    image: grafana/grafana-image-renderer:latest
    container_name: grafana-image-renderer
    user: "3000:3000"
    volumes:
      # /outside/container:/inside/container
      - /path/to/grafana-renderer-config/config.json:/usr/src/app/config.json
      # note NotoColorEmoji.ttf should be readable/executable
      - /path/to/grafana-renderer-config/NotoColorEmoji.ttf:/usr/share/fonts/opensans/NotoColorEmoji.ttf
      - /path/to/grafana-renderer-config/entrypoint.sh:/entrypoint.sh
    ports:
      - 18081:8081 

Entrypoint.sh looks like this:

#!/bin/sh
fc-cache -fv
fc-list
fc-match "Noto Color Emoji"

If this gets closed, no big deal as I've found my workaround... which I wanted to share for others!