Legend text doesn't fit inside the box in SVG output. Font size is different in SVG and PNG outputs at larger fonts. · Issue #171 · plotly/plotly.rs · GitHub
Skip to content

Legend text doesn't fit inside the box in SVG output. Font size is different in SVG and PNG outputs at larger fonts. #171

Closed

Description

@YDS67

A reproducible example can be found here: https://github.com/YDS67/rust-plotly-examples/tree/main/example5

I used scale 1 and resolution 1280x768 for both PNG and SVG. Using different scales for SVG just messed up the image.

PNG works fine, but there seems to be a limit on max font size.

I haven't been able to find any way to increase the legend width manually.

Activity

  1. andrei-ng commented on Jun 25, 2025

    @andrei-ng
    Collaborator

    I stumbled upon a similar issue and it took me some time to nail it down.
    So you ended up seeing this somehow by chance and somehow by design.

    I was working on an experimental feature to transition away from the old Kaleido setup. And I ran your example in it where I could use either Firefox or Chrome. The issue with SVG only appeared when using Chrome and not with Firefox.
    This crate's static export uses Kaleido which under the hood uses Chrome, so that meant somehow it had to do with how Chrome handled SVGs ... somehow.

    I am not a font's expert, but dumping both SVGs from Firefox and Chrome into Copilot provided a hint.

    Apparently ...

    • Both browsers use font-family: serif for legend and title, but map this to different actual fonts depending on browser/OS.
    • The generic 'serif' used in your example cause each browser to pick a different system font, each with unique width and metrics.

    I changed your example to use Font().family("Times New Roman, serif") everywhere and with that, PNG, PDF, and SVG render the same way.

    Image
    Image
    Data_plot.pdf

    @YDS67 Thanks for providing the example code. If all it is OK with you, I am going to copy Example5 code to the examples folder in ploty.rs for others that stumble upon the same issue.

    I will close this issue. Will add your example to this crate if you approve.

  2. YDS67 commented on Jun 25, 2025

    @YDS67
    Author

    @andrei-ng yes, of course, you can add my example, I don't mind. Thank you for working on this issue. Although personally I don't need SVG plots, some people may need them, for web or for Typst.

  3. andrei-ng commented on Jul 10, 2025

    @andrei-ng
    Collaborator

    @andrei-ng yes, of course, you can add my example, I don't mind. Thank you for working on this issue. Although personally I don't need SVG plots, some people may need them, for web or for Typst.

    Your example5 code is now as an example in https://github.com/plotly/plotly.rs/tree/main/examples/customization/consistent_static_format_export.

    Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    KaleidoIssue related to Kaleido dependency

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions