Plotly：如何以交互方式更改 3D 散點圖 plot 的軸變量？

Question

我在散點圖中繪制了一個多維表，以測試唯一數據框的列之間的關系。

我想知道是否有任何方法可以在瀏覽器中以交互方式更改每個軸中的變量，而無需 plot 另一個網格。

我不知道這是否是一個多余的問題，但我已經做了一些研究但沒有任何成功。

fig = px.scatter_3d(data, x="V1", y="V2", z= 'V3', hover_data=['Z'])
fig.show()

先感謝您。

Answer 1

下面的完整代碼片段將為您提供 JupyterLab 中的 Dash 應用程序，如下所示：

在這里，您可以從 plotly 數據集px.data.stocks()更改要顯示的列。 如果您可以使用這種方法，我很樂意解釋細節。 如果 JupyterLab 不是您的菜，只需按照Plotly 帖子中所述將其重寫為標准 Dash 應用程序所需的三個步驟：如何重寫標准 dash 應用程序以在 JupyterLab 中啟動它？

完整代碼_

import plotly as py
import pandas as pd

from plotly import tools
import plotly.express as px
import plotly.graph_objects as go

import dash
import dash_core_components as dcc
import dash_html_components as html
from jupyter_dash import JupyterDash
import dash_bootstrap_components as dbc
from dash.dependencies import Input, Output


app = JupyterDash(external_stylesheets=[dbc.themes.SLATE])


colors = px.colors.qualitative.Plotly
# colors = ['blue', 'green', 'red', 'black', 'yellow']
symbols = ['circle', 'circle-open', 'square', 'square-open', 'diamond', 'diamond-open', 'cross', 'x']

df = px.data.stocks().set_index('date')
columns = df.columns

# Set up well organized controls in a dbc.Card()
controls = dbc.Card([dbc.FormGroup([dbc.Label("x-axis"),
                                    dcc.Dropdown(id='dd_x',
                                                 options= [{'label': k, 'value': k} for k in columns],
                                                  value=columns[0],
                                                ),
                                   ],),
                    dbc.FormGroup([dbc.Label("y-axis"),
                                   dcc.Dropdown(id='dd_y',
                                                options= [{'label': k, 'value': k} for k in columns],
                                                value=columns[1],
                                                ),
                                   ],),
                    dbc.FormGroup([dbc.Label("z-axis"),
                                   dcc.Dropdown(id='dd_z',
                                                options= [{'label': k, 'value': k} for k in columns],
                                                value=columns[2],
                                                ),
                                    ],)
                    ],
                    body=True,
                    style = {'font-size': 'large'}
                    )

# Set up the app layout using dbc.Container(), dbc.Row(), and dbc.Col()
app.layout = dbc.Container([html.H1("Make a column selection for each axis"),
                            html.Hr(),
                            dbc.Row([dbc.Col([controls],xs = 4),
                                     dbc.Col([dbc.Row([dbc.Col(dcc.Graph(id="market_graph")),])]),
                                    ]),
                            html.Br(),
                            ],
                            fluid=True,
                            )

# 3D figure with callbacks for color, symbol and size
@app.callback(
    Output("market_graph", "figure"),
    [
        Input("dd_x", "value"),
        Input("dd_y", "value"),
        Input("dd_z", "value"),
    ],
)
def history_graph(x, y, z):
#     df = px.data.iris()
    fig = px.scatter_3d(df, x=df[x], y=df[y], z=df[z])

    fig.data[0].update(marker_color=colors[4])
    fig.data[0].update(marker_symbol=symbols[6])
    fig.data[0].update(marker_size=8)

    fig.update_layout(uirevision='constant')
    fig.update_layout(template = 'plotly_dark')
    fig.update_layout(margin=dict(l=10, r=10, b=10, t=10))
    return fig

app.run_server(mode='inline', port = 8007)