toImage function does not retain fonts that use quotes because of TOBESTRIPPED
@alexshoe arbeitet bereits daran.
Seit 28.10.2025.
- Vorherrschende Sprache
- JavaScript
- Sterne
- 18.3k
- Forks
- 2k
- Ø Merge
- 2 T. 12 Std.
- Gemergte PRs (30 T.)
- 28
Beschreibung
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: "Open Sans", 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".
Beitragsleitfaden
Erste Schritte
- Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
- Forke das Repository und arbeite in einem Branch.
- Öffne einen Pull Request, der die Issue-Nummer nennt.
Bewertung
Dieses Issue wurde noch nicht bewertet.