Skip to content

Unicode & Emoji (Font!?) Problem on conversion SVG ️ PDF | PNG.

Summary:

Hi, I'm trying to convert my SVG to PDF|PNG using inkscape commandline tool, but none of them are giving me the desired output, the SVG shows the emojis perfectly (at least in my OS and my browser!?), but the output of PDF or even PNG doesn't give the similar result. Actually, I don't know how to pass my font, or don't know why it doesn't keep the same font that SVG uses to generate PNG.

Steps to reproduce:

I'm using WSL2 on Windows & Python 3.10.6, though the Python part may be unrelated but I'll include it...

  1. Open Ubuntu 22.04 Terminal & install inkspace:
sudo apt-get install inkscape
  1. Install necessary packages on Python (pip install pandas rich PyMuPDF).
  2. Run Python code to get SVG.
  3. Convert SVG to PDF or PNG (using inkscape cli | Python's subprocess):
inkscape 16782742018544266.svg -o output.pdf
inkscape 16782742018544266.svg -o output.png -d 300
📦 Python Source Code (SVG)
# pip install pandas
import pandas as pd

# pip install rich
from rich.table import Table
from rich.console import Console
from rich.terminal_theme import MONOKAI

# To name files temporarily
import time

# sudo apt-get install inkscape (~360 MB)
import subprocess as sp

# pip install PyMuPDF
# PyMuPDF - Convert PDF to PNG
import fitz
# BytesIO - Save images in memory
from io import BytesIO
# pahtlib.Path - Delete unnecessary files
from pathlib import Path


def rich_svg_pdf_png():

    # Stores BytesIO PNGs
    ListOfPNGsBytesIO = list()

    # Create a DataFrame
    df = pd.DataFrame([('User1', '🐧', 180, 40),
                    ('User2', '', 200, 50),
                    ('User3', '𓁳', 210, 30)],
            columns=('Name', 'Character', 'Height', 'Score'))

    # Select the fields to display in the table
    table_data = df[
        [
            "Name", "Character", "Height",
            "Score",
        ]
    ]

    # Create a table
    #table = Table(title="Data Table", title_justify="center")
    table = Table()
    table.add_column("N", justify="center")
    table.add_column("Name", justify="center")
    table.add_column("Character", justify="center")
    table.add_column("Height", justify="center")
    table.add_column("Score", justify="center")

    # Add rows to the table
    for index, row in enumerate(table_data.itertuples()):
        table.add_row(
            str(index), str(row.Name), str(row.Character),
            str(row.Height), str(row.Score)
        )

    # Set the width of the table
    table.width = 115

    # Create a console
    console = Console(record=True)

    # Print the table
    console.print(table)

    # Set a name for SVG file, then delete it using pathlib.Path.unlink
    # tempnowtime, remove . from floating time to have a integrated integer number
    tempnowtime = str(time.time()).replace(".", "")
    SVGFileName = f"{tempnowtime}.svg"
    # Save as SVG file
    console.save_svg(
        path=SVGFileName, title=f"Users Table",
        theme=MONOKAI
    )

    PDFFileName = f"{tempnowtime}.pdf"

    # Convert SVG to PDF
    sp.run(["inkscape", SVGFileName, "-o", PDFFileName], stdout=sp.DEVNULL, stderr=sp.DEVNULL)

    # Open the PDF file
    pdf_doc = fitz.open(PDFFileName)

    # Iterate through the pages of the PDF file
    for page_num in range(pdf_doc.page_count):
        # Select the page
        pdf_page = pdf_doc.load_page(page_num)

        """ # Do something with the page, for example, save it as an image
        pix = pdf_page.get_pixmap()
        pix.save(f'page_{page_num + 1}.png') """

        # Render the page as a pixmap with a resolution of 300 DPI
        pixmap = pdf_page.get_pixmap(dpi=300)

        # Convert the pixmap to PNG bytes
        png_bytes = BytesIO(pixmap.tobytes("png"))

        # Append the png_bytes to the list
        ListOfPNGsBytesIO.append(png_bytes)

    # Close the PDF file
    pdf_doc.close()

    # Delete the unnecessary files
    resolve_svg = Path(SVGFileName).resolve()
    resolve_pdf = Path(PDFFileName).resolve()
    #Path.unlink(resolve_svg)
    #Path.unlink(resolve_pdf)

    return ListOfPNGsBytesIO

# Get BytesIO pics
get_pics = rich_svg_pdf_png()

# Iterate thorugh pics and write them as PNG file
for number, pic in enumerate(get_pics):
    with open(f"pic{number}.png", "wb") as f:
        f.write(pic.getbuffer())

What happened?

Unicode & emoji are not supported when converting SVG to PDF | PNG.

What should have happened?

Showing colored emojis on PNG and (at least) gray-scale emojis on PDF after converting SVG to PDF | PNG.

Sample attachments:

SVG:

16782742018544266.svg

PDF:

16782742018544266.pdf

PNG:

pic0

Version info

Inkscape 1.1.2 (0a00cf5339, 2022-02-04)

    GLib version:     2.72.4
    GTK version:      3.24.33
    glibmm version:   2.66.2
    gtkmm version:    3.24.5
    libxml2 version:  2.9.13
    libxslt version:  1.1.34
    Cairo version:    1.16.0
    Pango version:    1.50.6
    HarfBuzz version: 2.7.4
    Poppler version:  22.02.0

    OS version:       Ubuntu 22.04.2 LTS
Edited by Ali
To upload designs, you'll need to enable LFS and have an admin enable hashed storage. More information