Skip to content

Fix SVG scaling on fullscreen mode for st.graphviz_chart - #7398

Merged
kmcgrady merged 38 commits into
developfrom
fix/6527
Oct 27, 2023
Merged

Fix SVG scaling on fullscreen mode for st.graphviz_chart#7398
kmcgrady merged 38 commits into
developfrom
fix/6527

Conversation

@snehankekre

@snehankekre snehankekre commented Sep 21, 2023

Copy link
Copy Markdown
Contributor

Describe your changes

This PR addresses the scaling issues associated with GraphVizChart when in and exiting fullscreen mode.

Problem

When entering fullscreen with st.graphviz_chart:

  1. The SVG remained constant in width and height, but the parent div container StyledGraphVizChart scaled to fullscreen dimensions. (i.e. the chart is not actually fullscreen)
  2. Exiting fullscreen led the SVG to adopt the fullscreen dimensions while the container div reverted to its original size. This caused the SVG to appear disproportionately large with excessive vertical space.

Solution:

This PR ensures consistent scaling for both the parent div container and the SVG element:

  1. On entering fullscreen, both the SVG and its parent div scale to fullscreen dimensions.
  2. Exiting fullscreen mode restores both the SVG and the parent div to their original dimensions.

GitHub Issue Link (if applicable)

Closes #6527.

Testing Plan

  • Updated unit test
  • Added and migrated e2e tests from cypress to playwright.

Contribution License Agreement

By submitting this pull request you agree that all contributions to this project are made under the Apache 2.0 license.

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

Labels

change:bugfix PR contains bug fix implementation impact:users PR changes affect end users

Projects

None yet

Development

Successfully merging this pull request may close these issues.

GraphViz Charts when fullscreened dont render the same when exiting out of fullscreen

4 participants