存在數據空白時如何在 Plotly 中創建正確填充的線條

Question

基於https://plot.ly/python/line-charts/#filled-lines ，可以運行下面的代碼

import plotly.graph_objects as go

x = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
x_rev = x[::-1]
y = [5, 2.5, 5, 7.5, 5, 2.5, 7.5, 4.5, 5.5, 5]
y_upper = [5.5, 3, 5.5, 8, 6, 3, 8, 5, 6, 5.5]
y_lower = [4.5, 2, 4.4, 7, 4, 2, 7, 4, 5, 4.75]
y_lower_rev = y_lower[::-1]

fig = go.Figure()
fig.add_trace(go.Scatter(
    x=x, y=y,
    line_color='rgb(0,176,246)',
    name='Mid line',
))
fig.add_trace(go.Scatter(
    x=x+x_rev,
    y=y_upper+y_lower_rev,
    fill='toself',
    fillcolor='rgba(0,176,246,0.2)',
    line_color='rgba(255,255,255,0)',
    name='Filled lines working properly',
))
fig.update_traces(mode='lines')
fig.show()

並成功得到下面的情節

但是，如果存在數據間隙，填充的部分似乎無法正常工作（例如，第一個和第二個連接的組件），至少在下面嘗試的代碼中是這樣。

成功擁有數據空白和填充行的正確方法/代碼是什么？

x_for_gaps_example = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
x_for_gaps_example_rev = x_for_gaps_example[::-1]
y_with_gaps =[5, 15, None, 10, 5, 0, 10, None, 15, 5, 5, 10, 20, 15, 5]
y_upper_with_gaps = [i+1 if i is not None else None for i in y_with_gaps]
y_lower_with_gaps = [i-2 if i is not None else None for i in y_with_gaps][::-1]
fig = go.Figure()
fig.add_trace(go.Scatter(
    x=x_for_gaps_example,
    y=y_with_gaps,
    name='Mid Line with <b>Gaps</b>'
))

fig.add_trace(go.Scatter(
    x=x_for_gaps_example+x_for_gaps_example_rev,
    y=y_upper_with_gaps+y_lower_with_gaps,
    fill='toself',
    fillcolor='rgba(0,176,246,0.2)',
    line_color='rgba(255,255,255,0)',
    name='Filled Lines not working properly with <b>gaps</b>'
))

fig.show()