Plotly：如何在懸停三個 y 布局和一個 x 軸共享圖形時顯示所有堆疊的 y 軸數據值？

Question

python 3.6 最新 plotly 使用：python Graph 是使用 plotly 離線/在線函數創建的，其中三個不同的數據框輸入用於 y 軸繪圖，x 軸是共享的（通常是日期索引）。 圖表非常好。

僅針對特定子圖布局顯示當前布局圖形上的活動區域數據，我希望在任何布局中懸停鼠標時顯示所有三個布局數據。如何實現？

eq_high = go.Scatter(
                    x=df.index,
                    y=df['High'],
                    name = "EQHigh",
                    line = dict(color = '#3EBF06'),
                    opacity = 0.8)

    eq_low = go.Scatter(
                    x=df.index,
                    y=df['Low'],
                    name = "EQLow",
                    line = dict(color = '#FD2D00'),
                    opacity = 0.8)

    ##
    op_high_ce = go.Scatter(
                    x=stock_opt_ce.index,
                    y=stock_opt_ce['High'],
                    name = "OpHighCE",
                    line = dict(color = '#15655F'),
                    opacity = 0.8)

    op_low_ce = go.Scatter(
                    x=stock_opt_ce.index,
                    y=stock_opt_ce['Low'],
                    name = "OpLowCE",
                    line = dict(color = '#0D7B7F'),
                    opacity = 0.8)

    op_last_ce = go.Scatter(
                    x=stock_opt_ce.index,
                    y=stock_opt_ce['Last'],
                    name = "OpLastCE",
                    line = dict(color = '#6AA6A2'),
                    opacity = 0.8)


    op_settlePr_ce = go.Scatter(
                    x=stock_opt_ce.index,
                    y=stock_opt_ce['Settle Price'],
                    name = "OpSettlePrCE",
                    line = dict(color = '#2AADD1'),
                    opacity = 0.8)

    ##
    op_high_pe = go.Scatter(
                    x=stock_opt_pe.index,
                    y=stock_opt_pe['High'],
                    name = "OpHighPE",
                    line = dict(color = '#FA6300'),
                    opacity = 0.8)

    op_low_pe = go.Scatter(
                    x=stock_opt_pe.index,
                    y=stock_opt_pe['Low'],
                    name = "OpLowPE",
                    line = dict(color = '#AC4C0D'),
                    opacity = 0.8)

    op_last_pe = go.Scatter(
                    x=stock_opt_pe.index,
                    y=stock_opt_pe['Last'],
                    name = "OpLastPE",
                    line = dict(color = '#E19B6D'),
                    opacity = 0.8)

    op_settlepr_pe = go.Scatter(
                    x=stock_opt_pe.index,
                    y=stock_opt_pe['Low'],
                    name = "OpSettlePrPE",
                    line = dict(color = '#A54E1F'),
                    opacity = 0.8)

     data = [eq_high,eq_low,op_high_ce,op_low_ce,op_settlePr_ce,op_high_pe,op_low_pe,op_settlepr_pe]

    #custome Date Range plotting
    layout = dict(
        title = "Graph",
        xaxis = dict(
            range = ['2017-10-1','2017-11-27'])
    )

    fig = dict(data=data, layout=layout)
    iplot(fig, filename = "CorrelationOfEquityAndOptionData")
    plot(fig,show_link = False)

1.要在上面的代碼中進行哪些更改以在鼠標懸停時顯示所有三個布局數據值。當前它僅顯示一個布局圖值。

2.如何在右側或頂部或底部或左側顯示圖形數據點，而不是將圖形數據顯示在圖形上。

3.任何更好的優化方法。

預期結果：

Answer 1

在評論中進行了簡短討論后，此答案已被大量編輯

---

問題 1：

經過各種嘗試，目前看來這是不可能的。 但是在 github 上有一個問題：

他們希望懸停標簽出現在具有共享 x 軸的所有 y 軸上的所有軌跡上。 現在，它們只出現在您懸停的子圖中。

問題 2：

要更改懸停信息的顯示方式，請使用fig['layout']['hovermode'] 。 這里的問題是，你的選擇僅限於以下情況之一： 'x' ， 'y' ，或'closest' 。 如果您單擊Compare data on hover選項，則無法將其設置回fig['layout']['hovermode'] = 'y'而不再次運行您的代碼。 您還可以使用fig['data'][ser]['hoverinfo']= 'all'更改每個系列的信息顯示方式。 在這里，您可以在列表中插入多個選項，例如x或x+y 。

這是一個帶有一些隨機數據的示例：

# imports
from plotly.offline import download_plotlyjs, init_notebook_mode, plot, iplot
import pandas as pd
import plotly.graph_objs as go
import numpy as np

# setup
init_notebook_mode(connected=True)

# data
np.random.seed(1)
x = np.linspace(0, 1, 50)
y1 = np.cumsum(np.random.randn(50))
y0 = np.cumsum(np.random.randn(50))

# Data
trace0 = go.Scatter(
    x=x,
    y=y0,
)

trace1 = go.Scatter(
    x=x,
    y=y1,
)

# layout
layout = go.Layout(yaxis=dict(range=[-10,10])
)

# Plot
fig = go.Figure(data=[trace0, trace1], layout=layout)

# Edit hoveroptions
fig['layout']['hovermode'] = 'y'

for ser in range(0,len(fig['data'])):
    fig['data'][ser]['hoverinfo']= 'all'  


iplot(fig)

問題 3：

我很抱歉地說，我不知道任何其他優化的方法來做到這一點。

Answer 2

問題 1：

最簡單的方法是使用子圖在單個圖表上繪制所有 3 個圖表。 下面是制作子圖和獲取所有懸停信息的基本代碼。

from plotly.subplots import make_subplots

fig=make_subplots(rows=3, cols=1, shared_xaxes=True)

fig.update_layout(hovermode='x unified')

使用上述參數以及您可能需要的其他參數。

問題 2：

我一直在尋找一種方法來達到相同的結果，但尚未成功。

如果您找到答案，請告訴我。