Plotly Dash：如何在 html.Img 上方添加标题？

Question

我需要在图片上方添加标题，但目前还没有找到在图片上方添加标题的方法。有没有人知道如何获得图像上方的标题？您会看到我尝试添加了 html.Br 行，但这引发了一条错误消息。准确地说：标题应该在图像上方（它是一个标题），而不是重叠。

密码是：

    #https://dash.plotly.com/annotations
ddk.Row(
    style={'height': 'calc(20vh - 80px)'},
           children=[html.H5("I want to be above this Img"),
                     #html.Br(),
                       html.Img(
                           src='data:image/png;base64,{}'.format(encoded_image.decode()),
                           
                        )
                    ]
                           
        ),

Answer 1

您正在将标题和图像放置在行组件中，当您想要内联时使用该组件 children。将 Row 组件替换为 Block 组件。

ddk.Block(children=[
    html.H5("I want to be above this Img"),
    html.Img(src='data:image/png;base64,{}'.format(encoded_image.decode()))
])

Plotly Dash：如何在 html.Img 上方添加标题？

Plotly Dash: how to add heading above html.Img?

html

python

plotly

plotly-dash