plotly / plotly/plotly.js

Colorbar Orientation Change Causes Render Issue

Open
#6,973 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug good for agent P3
Dominant language
JavaScript
Stars
18.3k
Forks
2k
Avg merge
2d 12h
Merged PRs (30d)
28

Description

Hello,

I was adding a control to one of my graphs in order to change the colorbar orientation from 'v' to 'h' and back again (user discretion) and noticed that it was having some strange behaviors.

Basically, it renders very strangely on change -- leaving the labels from the previous orientation and skewing things.

I did find that if I turn off the colorbar after changing orientation and turn it back on that it renders correctly.

So, I have created a workaround that onchange of orientation I hide the colorbar, do a plotly.react, then trigger a show of the colorbar and a second plotly.react.

I have demonstrated this in the following codepen: https://codepen.io/dritchie/pen/NWmOrZL

I commented out the 'fix', so both the weird behaviors and the correction can be shown.

Thanks!

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked CodePen reproduction and inspect the plotly.react calls that change the colorbar orientation between 'v' and 'h'. Confirm the behavior with the colorbar enabled, then verify that changing orientation renders without labels from the previous orientation or skewed layout, without the hide-and-show workaround.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.