plotly / plotly/plotly.js

Scatter3D marker flickering/clipping while rotating the plot

Open
#6,505 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

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

Description

I'm noticing significant flicking/marker clipping while rotating a Scatter3D plot with the mouse.

The code below is a modified form of the example at https://plotly.com/python/3d-scatter-plots/. Note taht the opacity is set to 1.0. As I move around in the plot I see significant clipping/flickering of the markers, particularly when looking along the z-axis. If I change the opacity to 0.8 (like in the example) the flickering goes away. Any opacity other than 1.0 works fine. If you don't specify an opacity property the flickering is present (which is how I found this). I'm using plotly 5.11.0, viewing it in Chrome 107.0.5304.107.

import plotly.graph_objects as go
import numpy as np
import pandas as pd

# Helix equation
t = np.linspace(0, 20, 100)
x, y, z = np.cos(t), np.sin(t), t

z2 = pd.to_datetime('1 Jan 2022') + pd.to_timedelta(t, 'h')

fig = go.Figure(data=[go.Scatter3d(
    x=x,
    y=y,
    z=z2,
    mode='markers',
    marker=dict(
        size=12,
        color=z,                # set color to an array/list of desired values
        colorscale='Viridis',   # choose a colorscale
        opacity=1.0
    )
)])

# tight layout
fig.update_layout(margin=dict(l=0, r=0, b=0, t=0))
fig.show()

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

Reproduce the provided Scatter3d example with plotly 5.11.0 in Chrome 107, rotating the plot with marker opacity at 1.0 and then below 1.0. Compare the rendering behavior, especially when viewing along the z-axis; done means opaque markers no longer flicker or clip during rotation.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, python
Domain
data-visualization, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 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.