Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improved plot rendering #8580

Merged
merged 26 commits into from
Jun 20, 2024
Merged

Improved plot rendering #8580

merged 26 commits into from
Jun 20, 2024

Conversation

aliabid94
Copy link
Collaborator

Improved plot rendering. Main changes:

  • Native plots did not fit block. Resizing only "stretched" canvas (distorting text as well), did not actually repaint the plot. Now native plots fit block and repaint to fit on resize.
  • Plot uses theme values for styling (font, spacing, colors, etc.) so plots actually look native.
  • Dev reload mode did not work with plots, fixed (by removing svelte-vega dependency).
  • Cleaned up frontend code for plots.

BEFORE:
Recording 2024-06-19 at 13 00 32

AFTER:
Recording 2024-06-19 at 13 03 42

@aliabid94 aliabid94 requested a review from abidlabs June 19, 2024 20:06
@gradio-pr-bot
Copy link
Collaborator

gradio-pr-bot commented Jun 19, 2024

🪼 branch checks and previews

Name Status URL
Spaces ready! Spaces preview
Website ready! Website preview
Storybook ready! Storybook preview
🦄 Changes detected! Details

Install Gradio from this PR

pip install https://gradio-builds.s3.amazonaws.com/271c4e87938f35a1ec686bb51dde812e5106cd57/gradio-4.36.1-py3-none-any.whl

Install Gradio Python Client from this PR

pip install "gradio-client @ git+https://github.com/gradio-app/gradio@271c4e87938f35a1ec686bb51dde812e5106cd57#subdirectory=client/python"

Install Gradio JS Client from this PR

npm install https://gradio-builds.s3.amazonaws.com/271c4e87938f35a1ec686bb51dde812e5106cd57/gradio-client-1.1.1.tgz

@gradio-pr-bot
Copy link
Collaborator

gradio-pr-bot commented Jun 19, 2024

🦄 change detected

This Pull Request includes changes to the following packages.

Package Version
@gradio/plot patch
gradio patch

With the following changelog entry.

Improved plot rendering to thematically match
highlight:Expect visual changes in gr.Plot, gr.BarPlot, gr.LinePlot, gr.ScatterPlot, including changes to color and width sizing.

⚠️ The changeset file for this pull request has been modified manually, so the changeset generation bot has been disabled. To go back into automatic mode, delete the changeset file.

Something isn't right?

  • Maintainers can change the version label to modify the version bump.
  • If the bot has failed to detect any changes, or if this pull request needs to update multiple packages to different versions or requires a more comprehensive changelog entry, maintainers can update the changelog file directly.

@abidlabs abidlabs added the v: patch A change that requires a patch release label Jun 19, 2024
@abidlabs abidlabs changed the title changes Improved plot rendering Jun 19, 2024
@abidlabs
Copy link
Member

@abidlabs abidlabs requested a review from pngwn June 19, 2024 20:11
requirements.txt Outdated Show resolved Hide resolved
@abidlabs
Copy link
Member

abidlabs commented Jun 19, 2024

Backend changes look good. Tagged @pngwn to review the frontend changes when he's back. Agreed UI looks much nicer this way. This is a visual breaking change, so we should make sure

  • to mention this in the release notes (we can add a highlight to this changelog)
  • We should ensure that that users can get the previous behavior (a fixed width) if they want. The obvious way would be to use the width parameter, but that parameter seems to have no effect. Note that the height parameter is indeed working for me.

Side note, but I'm getting a bunch of deprecation warnings when running native_plots demo:

/Users/abidlabs/.pyenv/versions/3.12.2/lib/python3.12/site-packages/altair/utils/deprecation.py:65: AltairDeprecationWarning: 'selection' is deprecated.
   Use 'selection_point()' or 'selection_interval()' instead; these functions also include more helpful docstrings.
  warnings.warn(message, AltairDeprecationWarning, stacklevel=1)
/Users/abidlabs/.pyenv/versions/3.12.2/lib/python3.12/site-packages/altair/vegalite/v5/api.py:469: AltairDeprecationWarning: The types 'single' and 'multi' are now
        combined and should be specified using "selection_point()".
  warnings.warn(
/Users/abidlabs/.pyenv/versions/3.12.2/lib/python3.12/site-packages/altair/utils/deprecation.py:65: AltairDeprecationWarning: 'add_selection' is deprecated. Use 'add_params' instead.
  warnings.warn(message, AltairDeprecationWarning, stacklevel=1)

Copy link
Member

@pngwn pngwn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Frontend looks good to me apart from my one comment

js/plot/shared/Plot.svelte Outdated Show resolved Hide resolved
@aliabid94 aliabid94 enabled auto-merge (squash) June 20, 2024 23:03
@aliabid94 aliabid94 merged commit 797621b into main Jun 20, 2024
8 checks passed
@aliabid94 aliabid94 deleted the improve_plots branch June 20, 2024 23:09
This was referenced Jun 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
v: patch A change that requires a patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants