Wil*_*son 4 html python image plotly
这是如何将本地图像文件获取到<img>html 中的元素：
<html>
<h1>This is an image</h1>
<img src="file:///C:/Users/MyUser/Desktop/Plotly_Dash_logo.png" alt="image"></img>
</html>
这将按预期显示图像。但是，当我尝试使用绘图破折号包装元素制作同一页面时，它不起作用：
import dash
from dash import html, dcc
app = dash.Dash(__name__)
app.layout = html.Div([
html.H1('This is an image'),
html.Img(src=r'file:///C:/Users/MyUser/Desktop/Plotly_Dash_logo.png', alt='image'),
])
if __name__ == '__main__':
app.run_server(host='0.0.0.0', port=8080, debug=False, use_reloader=False)
本地图像文件不显示。但如果我用互联网上的文件替换源，比如'https://rapids.ai/assets/images/Plotly_Dash_logo.png'，它就可以正常工作。
这里发生了什么？
经过更多搜索后，我发现我可以将图像文件放在名为“assets/”的文件夹中，然后相对于应用程序文件夹引用它。
html.Img(src=r'assets/Plotly_Dash_logo.png', alt='image')
我还可以使用应用程序实例的特殊方法dash.Dash.get_asset_url()。
html.Img(src=app.get_asset_url('my-image.png'))
来源： https: //dash.plotly.com/dash-enterprise/static-assets
小智 5
我用了另一种方法：
with open(imgfile, "rb") as image_file:
img_data = base64.b64encode(image_file.read())
img_data = img_data.decode()
img_data = "{}{}".format("data:image/jpg;base64, ", img_data)
# ...
html.Img(id="tag_id", src=img_data, alt="my image", width="200", height="400",
className="img_class")
| 归档时间： |
|
| 查看次数： |
12664 次 |
| 最近记录： |