plotly / plotly/plotly.js

toImage function does not retain fonts that use quotes because of TOBESTRIPPED

Ouverte
#5,096 4 commentaires 0 réactions 1 personne assignée Voir sur GitHub

@alexshoe y travaille déjà.

Depuis le 28/10/2025.

bug P2
Langage dominant
JavaScript
Étoiles
18.3k
Forks
2k
Merge moyen
2 j 12 h
PR mergées (30 j)
28

Description

When you use toImage on a plotly plot the resulting image will not use the font currently on display if that font uses a font that has to be quoted. This is because those fonts are converted from "Open Sans" to TOBESTRIPPEDOpen SansTOBESTRIPPED. I suppose those than have 'to be stripped', but that does not happen as it seems.

You can see this happening in this plot:

https://codepen.io/hwalinga/pen/GRZrBoq

If you watch closely you can indeed see the font is thicker in the below converted image. But you can also inspect the element of the rendered plot and converted plot if you want to see the bug in action:

The title on the rendered plot will be:

<text class="gtitle" style="font-family: &quot;Open Sans&quot;, verdana, arial, sans-serif; font-size: 17px; fill: rgb(68, 68, 68); opacity: 1; font-weight: normal; white-space: pre;" x="952" y="50" text-anchor="middle" dy="0em" data-unformatted="Title with different font" data-math="N">Title with different font</text>

The title on the converted plot (which you can inspect with "right click" -> "View Image" and then use your inspect tools.)

<text xmlns="http://www.w3.org/2000/svg" class="gtitle" style="font-family: TOBESTRIPPEDOpen SansTOBESTRIPPED, verdana, arial, sans-serif; font-size: 17px; fill: rgb(68, 68, 68); opacity: 1; font-weight: normal; white-space: pre;" x="350" y="50" text-anchor="middle" dy="0em">Title with different font</text>

Not sure if this is maybe because this is a quote within a quote?

Also it seems you were already aware that this was an inappropriate solution to fixing quotation issues as by #1697. I hope with this bug report you will be more urged to implement something more robust soon.

EDIT:

There is a work around for these 'font-family' problems. Most application don't need to have font names with spaces to be quoted. In fact, this is in the CSS just a recommendation. 1 So you can just set the font-family without giving it quotes. It seems to have no bad side effect as I can see. Setting { font: { family: 'Open Sans, verdana, arial, sans-serif' }} in the layout set the same default fonts where it does not bug on "Open Sans".

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.