Streamlit中的图像与媒体组件,主要是st.imagest.audiost.video

它们是专为在Streamlit Web应用程序中嵌入和展示多媒体内容而设计的,这些组件不仅丰富了应用程序的呈现形式,还极大地提升了用户体验和互动性。

1. st.image

st.image函数用于在Streamlit应用程序中展示图像内容,增强视觉呈现效果。

比如,在数据可视化的场景中,通过st.image展示数据分析结果,如柱状图、折线图等;

在项目展示时,也可以通过在项目中嵌入产品图片、示意图等,提升用户理解。

它的主要参数有:

名称 类型 说明
image numpy.ndarray / [numpy.ndarray] / BytesIO / str / [str] 要显示的图像,也可以指定一个图像URL或URL列表
caption str/[str] 图像标题,如果显示多幅图像,应当是字符串列表
width int / None 图像宽度,None表示使用图像自身宽度
clamp bool 是否将图像的像素值压缩到有效域(0~255),仅对字节数组图像有效
channels "RGB" / "BGR" 图像通道类型
output_format "JPEG" / "PNG" / "auto" 图像格式
use_container_width bool 如果设置为True,则使用列宽作为图像宽度

1.1. 使用示例

展示本地图像文件,通过image参数接受PIL图像对象,caption参数为图像添加标题,

width参数设置了图像的显示宽度。

import streamlit as st
from PIL import Image # 读取本地图像文件
image = Image.open("path/to/your/image.jpg") # 使用st.image展示图像,并设置标题和宽度
st.image(image, caption="这是一张本地图片", width=300)

展示URL图像,并使用use_column_width参数使图像宽度自适应Streamlit列的宽度。

# 图像URL
image_url = "http://xxx.com/xxx.jpeg" # 使用st.image展示URL图像,并设置使用列宽
st.image(
image_url,
use_column_width=True,
caption="这是一张网络图片",
)

图片的宽度会随着浏览器窗口的大小自适应变化。

2. st.audio

st.audio函数用于在Streamlit应用程序中嵌入音频内容,为数据分析结果添加声音效果,增强表现力。

它的主要参数有:

名称 类型 说明
data str / bytes / BytesIO / numpy.ndarray / file 要播放的音频数据,可以是字节码流、numpy.ndarray或打开的文件
format str 音频文件的MIME类型,如'audio/ogg'、'audio/mp3'等
start_time int / float / timedelta / str / None 指定音频播放的起始时间
sample_rate int / None 音频的采样率,播放音频时,通常不需要直接设置这个参数
end_time int / float / timedelta / str / None 指定音频播放的结束时间
loop bool 是否循环播放音频
autoplay bool 是否自动播放音频

2.1. 使用示例

播放本地音频文件,autoplay参数设置为True,使音频自动播放。

import streamlit as st

# 打开本地音频文件
audio_file = open("path/to/your/audio.mp3", "rb")
audio_bytes = audio_file.read() # 使用st.audio播放音频,并自动播放
st.audio(
audio_bytes,
format="audio/mp3",
autoplay=True,
)

运行之后会自动播放。

st.image一样,音频也可以传入URL,直接播放在线的音频。

3. st.video

st.video函数用于在Streamlit应用程序中嵌入视频内容,通过视频展示分析结果的特点或分析过程。

它的主要参数有:

名称 类型 说明
data str / bytes / BytesIO / numpy.ndarray / file 要播放的视频数据,可以是URL字符串、字节码流、numpy.ndarray或打开的文件
format str 视频文件的MIME类型,如'video/mp4',默认值为'video/mp4'
start_time int / float / timedelta / str / None 视频开始播放的时间
subtitles str / bytes / Path / io.BytesIO / dict 视频字幕数据
end_time int / float / timedelta / str / None 视频结束播放的时间
loop bool 是否循环播放视频
autoplay bool 是否自动播放视频
muted bool 是否静音播放

3.1. 使用示例

播放本地视频文件, 通过start_timeend_time参数设置了视频播放开始和结束的时间(秒)。

import streamlit as st

# 打开本地视频文件
video_file = open('path/to/your/video.mp4', 'rb')
video_bytes = video_file.read() # 使用st.video播放视频,并设置标题和开始时间
st.video(
video_bytes,
format="video/mp4",
start_time=5,
end_time=10,
)

运行之后,视频加载后停在5s的位置,点击播放,播放到10s时自动停止。

4. 总结

总之,st.imagest.audiost.video这三个组件共同构成了Streamlit中强大的多媒体展示工具集。

它们各自专注于图像、音频和视频的展示与播放,通过丰富的参数设置和灵活的嵌入方式,为开发者提供了极大的便利和创意空间。

无论是构建数据可视化应用、产品展示页面还是在线教育平台,这些组件都能帮助开发者轻松实现多媒体内容的嵌入与呈现。

『玩转Streamlit』--图像与媒体组件的更多相关文章

  1. Github 恶搞教程(一起『玩坏』自己的 Github 吧)

    最近在伯乐在线读到一篇趣文,<如何在 Github『正确』做贡献>,里面各种能人恶搞 Github 的『Public contributions』,下面截取几个小伙伴的战绩: 顺藤摸瓜,发 ...

  2. 2018-2019-2 20165316 『网络对抗技术』Exp3:免杀原理与实践

    2018-2019-2 20165316 『网络对抗技术』Exp3:免杀原理与实践 一 免杀原理与实践说明 (一).实验说明 任务一:正确使用msf编码器,msfvenom生成如jar之类的其他文件, ...

  3. js实现『加载更多』功能实例

    DEMO : 滚动加载示例 关于如何实现『加载更多』功能,网上有插件可用,例如比较著名的使用iscroll.js实现的上拉加载更多.下拉刷新功能. 但实际用起来却是很麻烦.由于是第三方插件,要按照对方 ...

  4. 『Asp.Net 组件』Asp.Net 服务器组件 内嵌JS:让自己的控件动起来

    代码: using System; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace ...

  5. 2018-2019-2 20165221『网络对抗技术』Exp4:恶意代码分析

    2018-2019-2 20165221『网络对抗技术』Exp4:恶意代码分析 实验要求: 是监控你自己系统的运行状态,看有没有可疑的程序在运行. 是分析一个恶意软件,就分析Exp2或Exp3中生成后 ...

  6. 『Asp.Net 组件』Asp.Net 服务器组件 内嵌图片:自己的图片控件

    代码: using System; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace ...

  7. 『Asp.Net 组件』Asp.Net 服务器组件 的开发优势和劣势

    在写<Asp.Net 服务器组件系列文档>之前,笔者不才,揣测微软战略用意: 微软利益诉求莫过于 微软产品和技术的市场份额: 因此,微软战略之一莫过于将 所有开发人员 团聚在 微软周围,以 ...

  8. 2017-2018-2 20155303『网络对抗技术』Exp6:信息收集与漏洞扫描

    2017-2018-2 20155303『网络对抗技术』 Exp6:信息收集与漏洞扫描 --------CONTENTS-------- 一.原理与实践说明 1.实践内容 2.基础问题 二.实践过程记 ...

  9. 2018-2019-2 20165225『网络对抗技术』Exp2:后门原理与实践

    2018-2019-2 20165225『网络对抗技术』Exp2:后门原理与实践 一.实验说明 任务一:使用netcat获取主机操作Shell,cron启动 (0.5分) 任务二:使用socat获取主 ...

  10. 20165308『网络对抗技术』Exp5 MSF基础应用

    20165308『网络对抗技术』Exp5 MSF基础应用 一.原理与实践说明 实践内容 本实践目标是掌握metasploit的基本应用方式,重点常用的三种攻击方式的思路.具体需要完成: 一个主动攻击实 ...

随机推荐

  1. centos7.5离线安装zabbix4.0

    一.配置环境 1.1 Linux环境说明 zabbix 安装要求 https://www.zabbix.com/documentation/4.0/zh/manual/installation/req ...

  2. Python正则表达式提取车牌号

    在Python中使用正则表达式(Regular Expressions)来提取车牌号是一个常见的任务,尤其是在处理车辆信息或进行图像识别后的文本处理时.中国的车牌号格式多种多样,但通常包含省份简称.英 ...

  3. 图文教程:从0到1将项目发布到 Maven 中央仓库

    前言 本文基于官方文档 https://central.sonatype.org/publish/publish-guide/ 编写. 发布步骤: 创建账号 创建用户 Token 创建命名空间 配置 ...

  4. Consider defining a bean of type 'xxxxxx' in your configuration.

    解决: 在Application类上新增@EnableConfigurationProperties({ xxxxxx.class})

  5. 小忙半个月搞个CKA,可还行,搞完后发现自己被割韭菜了

  6. Redis常见问题和性能监控

    1 Redis常见面试问题 1.1 Redis是单线程还是多线程 Redis不同版本之间采用的线程模型是不一样的,在Redis4.0版本之前使用的是单线程模型,在4.0版本之后增加了多线程的支持. 在 ...

  7. AT_agc057_e 题解

    AT_agc057_e [0] 约定 \(r_i = \sum\limits_{j = 1}^{m}[A_{i,j}\le k]\) \(r^{'}_i = \sum\limits_{j = 1}^{ ...

  8. fluent python-chap3-1

    class collections.OrderedDict([items]) 返回一个 dict 子类的实例,它具有专门用于重新排列字典顺序的方法. """ move_t ...

  9. 主流流媒体的综合性能大 PK ( smart_rtmpd, srs, zlm, nginx rtmp )

    简述 随着互联网的发展,音视频行业越来越火,自然而然的流媒体服务器也是百花齐放.市面上也有很多种类的流媒体服务器,让人眼花缭乱.特别是对技术了解不深的朋友,更不知道怎么选择. 其实作为服务器,主要考察 ...

  10. mac M1,M2,M3芯片踩坑 nodejs ruby brew

    问题&解决方法 先说解决方法, 感兴趣的可以了解事情的经过, 也许我描述的问题不专业, 但确实解决了当下的问题, 欢迎留言讨论 这里主要是两个问题, 一个是启用rosetta模式失败, 一个是 ...