Skip to content

Fix "Update Button" example in Python custom buttons doc page #3793

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

Merged
merged 2 commits into from
Sep 13, 2024

Conversation

conpierce8
Copy link
Contributor

@conpierce8 conpierce8 commented Jun 23, 2022

TL;DR

The annotations in the Update Button example in the Python docs do not update correctly when the buttons are clicked (see images below), apparently due to positioning the annotations using date values on a non-date xaxis. This pull request modifies the code defining the annotations so that the buttons update correctly.

Issue Description

Observed behavior:

When the "High", "Low", and "Both" buttons are clicked:

  • The "Low Min" and "High Max" annotations do not appear
  • The "High Average" and "Low Average" traces do not appear
  • The "High" and "Low" traces do not toggle visibility

The images below show the appearance of the plot

  1. In its initial state
  2. After clicking the "High" button
  3. After clicking the "Low" button
  4. After clicking the "Both" button

Initial state:
initial_state

"High" clicked:
high

"Low" clicked:
low

"Both" clicked:
both

Expected behavior:

  1. When "None" is clicked, the plot will display the "High" and "Low" traces with no annotations
  2. When "High" is clicked, the plot will display the "High" and "High Average" traces, and the "High Average" and "High Max" annotations
  3. When "Low" is clicked, the plot will display the "Low" and "Low Average" traces, and the "Low Average" and "Low Min" annotations
  4. When "Both" is clicked, the plot will display all traces and annotations.

Proposed solution

  • Change the x position of the "High Average" and "Low Average" annotations to use numerical values instead of date values.
  • Specify the xanchor, yanchor, xref, and yref attributes for the "High Average" and "Low Average" annotations to ensure correct positioning of the annotations to the left of the figure yaxis.
  • Eliminate usage of hex colors in the example.

Documentation PR

  • I've seen the doc/README.md file
  • This change runs in the current version of Plotly on PyPI and targets the doc-prod branch OR it targets the master branch
  • If this PR modifies the first example in a page or adds a new one, it is a px example if at all possible Does not modify the first example or add a new example.
  • Every new/modified example has a descriptive title and motivating sentence or paragraph
  • Every new/modified example is independently runnable
  • Every new/modified example is optimized for short line count and focuses on the Plotly/visualization-related aspects of the example rather than the computation required to produce the data being visualized
  • Meaningful/relatable datasets are used for all new examples instead of randomly-generated data where possible No new examples added.
  • The random seed is set if using randomly-generated data in new/modified examples No randomly-generated data is used.
  • New/modified remote datasets are loaded from https://plotly.github.io/datasets and added to https://github.com/plotly/datasets No datasets added or modified.
  • Large computations are avoided in the new/modified examples in favour of loading remote datasets that represent the output of such computations
  • Imports are plotly.graph_objects as go / plotly.express as px / plotly.io as pio
  • Data frames are always called df
  • fig = <something> call is high up in each new/modified example (either px.<something> or make_subplots or go.Figure)
  • Liberal use is made of fig.add_* and fig.update_* rather than go.Figure(data=..., layout=...) in every new/modified example
  • Specific adders and updaters like fig.add_shape and fig.update_xaxes are used instead of big fig.update_layout calls in every new/modified example
  • fig.show() is at the end of each new/modified example
  • plotly.plot() and plotly.iplot() are not used in any new/modified example
  • Hex codes for colors are not used in any new/modified example in favour of these nice ones

@conpierce8 conpierce8 marked this pull request as ready for review June 23, 2022 21:25
@gvwilson gvwilson requested a review from marthacryan July 19, 2024 14:58
@gvwilson gvwilson added P2 considered for next cycle community community contribution fix fixes something broken labels Aug 12, 2024
@gvwilson gvwilson closed this Aug 23, 2024
@gvwilson gvwilson reopened this Aug 23, 2024
Copy link
Member

@LiamConnors LiamConnors left a comment

Choose a reason for hiding this comment

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

This looks great. Thanks for the PR! and sorry for the delay in getting it merged.

@LiamConnors LiamConnors merged commit 2f88c51 into plotly:doc-prod Sep 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
community community contribution fix fixes something broken P2 considered for next cycle
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants