[BUG]: Violin box.line.color disappears after Plotly.restyle, but initial render shows it
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 52/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- javascript, playwright, python
- Domain
- data-visualization, frontend
Research direction
Start by running the supplied Python reproduction with Plotly Express, pio.to_html, Plotly.restyle, and Playwright, then compare the two screenshots. Trace the violin trace at fig.data[2] and the generated HTML to identify why box.line.color differs before and after restyle. Done means the red embedded box outline renders consistently in both cases, with regression coverage for the reported sequence.
Written by the indexing model from the issue text.
Description
Description
A Plotly Express scatter plot with marginal violins renders differently depending on
when box.line.color is applied to one violin trace.
If fig.data[2].box.line.color = "red" is set before the first render, the red box
outline inside the blue violin is visible. If the same base figure is rendered first
and the same value is applied later with Plotly.restyle, the red outline is missing.
Screenshots/Video
Steps to reproduce
import io
import plotly
import plotly.express as px
import plotly.io as pio
from PIL import Image, ImageChops
from playwright.sync_api import sync_playwright
print(f"Plotly version: {plotly.__version__}")
df = px.data.iris()
fig = px.scatter(
df,
x="sepal_width",
y="sepal_length",
color="species",
marginal_y="violin",
marginal_x="box",
trendline="ols",
template="simple_white",
)
# plot1.png: set the violin embedded box line color before the first render.
fig.data[2].box.line.color = "red"
assert fig.data[2].box.line.color == "red"
html1 = pio.to_html(fig, full_html=True, include_plotlyjs="cdn")
# plot2.png: render first, then apply the same value with Plotly.restyle.
fig.data[2].box.line.color = None
html2 = pio.to_html(fig, full_html=True, include_plotlyjs="cdn")
html2 = html2.replace(
"</body>",
"""
<script>
window.addEventListener("DOMContentLoaded", () => {
const plotEl = document.getElementsByClassName("plotly-graph-div")[0];
setTimeout(() => {
Plotly.restyle(plotEl, {"box.line.color": "red"}, [2]);
}, 1000);
});
</script>
</body>""",
)
with sync_playwright() as playwright:
browser = playwright.chromium.launch(
headless=True,
args=["--no-sandbox", "--disable-dev-shm-usage", "--disable-gpu"],
)
page = browser.new_page(viewport={"width": 1200, "height": 800})
page.set_content(html1)
page.wait_for_timeout(1500)
img1 = page.screenshot(path="plot1.png")
page.set_content(html2)
page.wait_for_timeout(2000)
img2 = page.screenshot(path="plot2.png")
browser.close()
diff = ImageChops.difference(
Image.open(io.BytesIO(img1)).convert("RGB"),
Image.open(io.BytesIO(img2)).convert("RGB"),
)
assert diff.getbbox() is not None, "Screenshots are unexpectedly identical."
print("Saved plot1.png and plot2.png")
Notes
Add info here that doesn't fit in the other sections.
- Dominant language
- Python
- Stars
- 18.8k
- Forks
- 2.8k
- Avg merge
- 16h 26m
- Merged PRs (30d)
- 21
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from plotly/plotly.py
-
P3 size: 1 task
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
bug P1
Difficulty 1/5 Under an hour Newbie friendliness 68/100
-
feature P3
Difficulty 2/5 1-3 hours Newbie friendliness 62/100
-
feature P3
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
Difficulty 3/5 1-2 days Newbie friendliness 35/100
All issues in plotly/plotly.py
Similar issues
-
triage/confirmed
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
agentscope-ai/agentscope#2775 ·
-
comp/desktop P3 type/bug
Difficulty 1/5 Under an hour Newbie friendliness 92/100
NousResearch/hermes-agent#118866 ·
-
bug
Difficulty 1/5 Under an hour Newbie friendliness 90/100
apache/cloudstack#14222 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 82/100