plotly / plotly/dash

Graph Viewpoint Reset Issue

Open
#2,281 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug P3
Dominant language
Python
Stars
24.4k
Forks
2.3k
Avg merge
2d 7h
Merged PRs (30d)
13

Description

I want to modify the contents of a 3d scatterplot (from plotly.graph_objects) based on keyboard input in a Dash application. Since the 3d scatterplot is interactable, the user is able to change the viewpoint and pan the camera to explore the scatterplot.

When keyboard input is received, the scatterplot is returned but the camera position and rotation does not persist. However, it does persist if the user gives two or more consecutive keyboard inputs.

These are the steps to recreate the issue. If I rotate and/or pan the camera and press "r", then rotate and/or pan the camera again and press "r", the camera suddenly snaps to the last position instead of maintaining the current position.
However, if rotate and/or pan the camera and press "r" twice, then rotate and/or pan the camera and press "r" twice, the camera no longer snaps to the last position and maintains the current position.

Please let me know if I am missing a parameter or argument when creating the dcc.Graph object to stop this snapping behavior.
Here is the code to reproduce the issue

import numpy as np
import plotly.graph_objects as go
from dash_extensions import Keyboard
from dash import Dash, dcc, html, Input, Output, no_update

def create_app():
    app = Dash(__name__)
    data = np.random.rand(1000,3)
    fig = go.Figure(go.Scatter3d(
            x=data[:,0],
            y=data[:,1],
            z=data[:,2],
            mode='markers',
            ))
    fig.update_traces(hoverinfo="none", hovertemplate=None)
    fig.update_layout(
        autosize=False,
        width=900,
        height=600,
        uirevision='constant',
        margin= {'b':0,'l':0,'r':0,'t':0,'pad':0},
        xaxis = {'visible': False, 'showticklabels': False},
        yaxis = {'visible': False, 'showticklabels': False},
        scene = dict(
            aspectmode='cube',
            camera = dict(center=dict(x=0,y=0,z=0), eye=dict(x=1.25,y=1.25,z=1.25),up=dict(x=0,y=0,z=1))
            ))

    app.layout = html.Div(
        [
            dcc.Graph(
                id="scatter-graph",
                figure=fig,
                clear_on_unhover=True,
            ),
            Keyboard(id='keyboard')
        ]
    )

    @app.callback(
        Output('scatter-graph', 'figure'),
        Input('scatter-graph', 'figure'),
        Input('keyboard', 'keydown'),
        Input('keyboard', 'n_keydowns'),
    )
    def foo(graph_fig, keydown, keypress):
        if keydown and keydown['key'].lower() == 'r':
            print('return graph')
            '''
            Some operations to modify the contents of the graph.
            '''
            return graph_fig
        print('no update')
        return no_update

    return app

if __name__ == '__main__':
    app = create_app()
    app.run_server(debug=True, use_reloader=False)

Libraries:

- dash==2.6.2
- dash-core-components==2.0.0
- dash-extensions==0.0.29rc2
- dash-html-components==2.0.0
- numpy==1.23.3
- plotly==5.10.0

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

Run the supplied Dash reproducer with the listed Dash, dash-extensions, NumPy, and Plotly versions, focusing on the dcc.Graph callback inputs and the Keyboard keydown handling. Confirm the camera behavior after rotating or panning and pressing "r" once versus twice; done means the current camera position and rotation persist after a single input.

Written by the indexing model from the issue text.

Assessment

Tech stack
python
Domain
data-visualization
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.