Plotly Dash - 渐变线

Question

是否可以使用 Plotly Dash 创建线条颜色渐变的折线图（纯粹为了美观）？

我尝试使用类似的东西：

'line': {'color': 'linear-gradient(90deg, red, red 60%, white)' }

完整图形代码示例（以破折号表示）：

dcc.Graph(
    id='MORTGAGE_RATES',
    figure={
        'data': [
             { "x": MORTGAGE30US['date'],"y": MORTGAGE30US['value'],"mode": "lines","name": '30 YR', 'line': {'color': 'linear-gradient(90deg, red, red 60%, white)' }},
             { "x": MORTGAGE15US['date'],"y": MORTGAGE15US['value'],"mode": "lines","name": '15 YR',},
        ],
        'layout': {
            'title': 'MORTGAGE RATES',
            "paper_bgcolor": "rgb(46, 54, 65)",
            "plot_bgcolor": "rgb(46, 54, 65)",
            'font': {
                'color': "rgb(255,255,255)"
            }
        }
    }
)

Answer 1

此功能尚不适用于 2D 线图，目前仅适用于 3D 线图，请参阅 https://github.com/plotly/plotly.js/issues/581。但是，如果您使用标记而不是线条，则可以在 2D 图中使用色标，请参见下面的示例。

import plotly.graph_objects as go
import numpy as np

t = np.linspace(0, 10, 1000)
x, y = t, np.cos(t)

data = go.Scatter(x=x, y=y, mode='markers', marker={'color': x, 'colorscale': 'Rainbow', 'size': 10})

layout = dict(plot_bgcolor='white', margin=dict(t=0, b=0, r=0, l=0, pad=0),
              xaxis=dict(showgrid=False, zeroline=False, mirror=True, linecolor='gray'),
              yaxis=dict(showgrid=False, zeroline=False, mirror=True, linecolor='gray'))

fig = go.Figure(data=data, layout=layout)

fig.show()

Plotly Dash - 渐变线

Plotly Dash - Gradient Lines

python

plotly

plotly-dash