您当前的位置:首页 > 电脑百科 > 硬件技术 > 硬件知识

使用Streamlit从简单的Python脚本创建交互式WebApp

时间:2020-06-16 12:33:14  来源:  作者:

如果有人告诉您可以使用150-200行代码创建交互式Web应用程序,该怎么办? 有趣的权利。 Streamlit为您提供了使用简单的Python脚本和一些streamlit调用来创建漂亮的Web应用程序的相同机会。

使用Streamlit从简单的Python脚本创建交互式WebApp

 

Streamlit是一个开放源代码框架,用于以最快的方式创建数据科学和机器学习应用程序以进行数据探索。 我最喜欢streamlit的地方是它为您提供了实时编码体验。 您可以启动流式应用程序,并且每次保存时,您都会看到代码同时反映在浏览器中。 整齐吧!

使用Streamlit从简单的Python脚本创建交互式WebApp

 

在这篇文章中,我们将为印度的Covid-19 Impact Analysis构建一个Streamlit Web应用程序。 我已经创建了完整的网站,您可以在这里浏览它-www.corona-updates.in。 我们不会深入研究Pandas,但是本教程将更侧重于Streamlit。 我们将研究一些Pandas库函数,但将深入探讨Streamlit。 因此,让我们开始吧!

要求:

· Streamlit

· Pandas

· plotly.express

使用pip安装streamlit:

pip install streamlit

安装完成后,您可以通过运行示例应用程序对其进行测试。

streamlit hello

您可以使用以下命令运行名为App.py的流式Web应用程序:

streamlit run app.py

精通Streamlit之后,现在就创建我们的网络应用。 创建一个python文件app.py,然后导入您需要创建的库和python脚本以及streamlit。

使用Streamlit从简单的Python脚本创建交互式WebApp

 

1.导入数据库

我们正在使用以下惊人的API导入数据库,以了解Covid-19印度的影响:https://api.covid19india.org。

使用Streamlit从简单的Python脚本创建交互式WebApp

 

在这里,在load_data()方法中,我们正在使用pandas库读取.csv文件,并且通过缓存数据来提高代码效率。 但是随着Covid-19的数据不断变化,我们每5分钟或最多20个条目清除一次缓存。 如果您有一个不经常更改数据的用例,则只需使用@ st.cache(persist = True)

2.创建标题,文本内容和侧边菜单

Streamlit支持markdown,因此在我们的网络应用中使用不同的字体大小非常容易。 它还通过传递参数来支持html:unsafe_allow_html =对st.markdown()调用正确,因此,我们可以按需要的方式设置文本样式。

使用Streamlit从简单的Python脚本创建交互式WebApp

 


使用Streamlit从简单的Python脚本创建交互式WebApp

 

由于我们使用HTML将自定义颜色设为蓝色,因此说明显示为蓝色。 我们也可以使用标头和子标头,就像我们将st.title()用于不同的标题一样。 或者我们可以为此使用markdown。

//will also give the same result as st.title()
st.markdown("#  Covid-19 Impact in India")
st.sidebar.title('Select the parameters to analyze Covid-19 situation')

3.插入复选框,单选按钮和滑块

使用Streamlit从简单的Python脚本创建交互式WebApp

 

st.sidebar.checkbox("Show Analysis by State", True, key=1)
select = st.sidebar.selectbox('Select a State',data['State'])
#get the state selected in the selectbox
state_data = data[data['State'] == select]
select_status = st.sidebar.radio("Covid-19 patient's status", ('Confirmed',
'Active', 'Recovered', 'Deceased'))

· 复选框-复选框中的第一个参数定义复选框的标题,第二个参数定义True或False,即默认情况下是否选中它,第三个参数定义复选框的唯一键。

· 选择框—此选择框包含所有印第安州。 第一个参数是选择框的标题,第二个参数定义要在选择框中填充的值的列表。 在这里,第二个参数是我们之前加载的.csv文件中的列名"州"。 您可以自己打开和浏览表格。 在下一行中,我们仅从选择框中获取state_data中针对所选状态的数据条目。 我们也可以在此处传递关键参数。

· 单选按钮—仅供您参考,我们目前尚未真正在Web应用程序中使用它。 与往常一样,第一个参数是广播组的标题,第二个参数接受选项的元组。 我们也可以在此处传递关键参数。

Plotting a graph

使用Streamlit从简单的Python脚本创建交互式WebApp

 

def get_total_dataframe(dataset):
    total_dataframe = pd.DataFrame({
    'Status':['Confirmed', 'Active', 'Recovered', 'Deaths'],
    'Number of cases':(dataset.iloc[0]['Confirmed'],
    dataset.iloc[0]['Active'], dataset.iloc[0]['Recovered'],
    dataset.iloc[0]['Deaths'])})
    return total_dataframe
state_total = get_total_dataframe(state_data)
if st.sidebar.checkbox("Show Analysis by State", True, key=2):
    st.markdown("## **State level analysis**")
    st.markdown("### Overall Confirmed, Active, Recovered and " +
    "Deceased cases in %s yet" % (select))
    if not st.checkbox('Hide Graph', False, key=1):
        state_total_graph = px.bar(
        state_total, 
        x='Status',
        y='Number of cases',
        labels={'Number of cases':'Number of cases in %s' % (select)},
        color='Status')
        st.plotly_chart(state_total_graph)

方法get_total_dataframe()用于获取数据框,以绘制选定状态的图。 dataset.iloc [0] [Confirmed]将返回" Confirmed"列的第一项,并且由于我们仅传递所选状态的数据,因此在" Confirmed"," Recovered"," Active"和" Deceased"列中将只有一个条目。 (检出.csv文件)

未选中"按状态显示分析"复选框,我们不会在主屏幕上看到"状态级别分析"部分。 同样,如果选中了"隐藏图形"复选框,我们将不会看到图形。

要绘制图形,我们将使用plotly.express库的bar方法。 第一个参数是我们要绘制的数据框,第二个参数是x轴的列,第三个参数是y轴的列,如果要更改列名,则labels参数是可选的 对于图形和颜色参数,此处是根据数据框中的"状态"列对图形进行颜色编码。

最后,为了显示该图在我们的Web应用程序中,我们使用st.plotly_chart()方法。 我们也可以使用st.write()来显示图形。

5.显示数据框或表

使用Streamlit从简单的Python脚本创建交互式WebApp

 

· st.dataframe():第一张图片是st.dataframe()的结果,用于第二张图片中的同一数据集。 您还可以使用内部调用st.datframe()的st.write()。

· st.table():我们使用st.table()获得了第二张图片中的表格。 这显示了数据框中的所有数据,而没有任何滚动。

def get_table():
    datatable = data[['State', 'Confirmed', 'Active', 'Recovered', 'Deaths']].sort_values(by=['Confirmed'], ascending=False)
    datatable = datatable[datatable['State'] != 'State Unassigned']
    return datatable
datatable = get_table()
st.markdown("### Covid-19 cases in India")
st.markdown("The following table gives you a real-time analysis of the confirmed, active, recovered and deceased cases of Covid-19 pertaining to each state in India.")
st.dataframe(datatable) # will display the dataframe
st.table(datatable)# will display the table

在get_table()中,我们通过从选择框获得的状态的最高"已确认"情况获得排序后的数据框。 我们还会从数据集中删除状态为"未分配状态"的行。

而已! 是的,就是这么简单。 :)

您已经准备创建自己的Web应用程序并尝试使用Streamlit。 这篇文章是关于如何使用简单的Python脚本创建Streamlit应用程序的,我希望您喜欢它。 我创建了另一本有关如何使用AWS EC2部署此Web应用程序的详细教程。 请检查一下,让我知道您的意见。

我已经为印度的Covid-19 Impact创建了完整的Streamlit Web应用程序,并使用AWS EC2进行了部署。 您可以在这里查看它-www.corona-updates.in。 请在评论部分提供您的宝贵反馈。 谢谢 :)

(本文翻译自Nishtha Goswami的文章《Using Streamlit to create interactive WebApps from simple Python scripts》,参考:
https://medium.com/swlh/using-streamlit-to-create-interactive-webapps-from-simple-python-scripts-f78b08e486e7)



Tags:Streamlit   点击:()  评论:()
声明:本站部分内容及图片来自互联网,转载是出于传递更多信息之目的,内容观点仅代表作者本人,如有任何标注错误或版权侵犯请与我们联系(Email:2595517585@qq.com),我们将及时更正、删除,谢谢。
▌相关推荐
1 说明:===初探===1.1 Streamlit1.1.1 是一个开源Python库,可轻松构建用于机器学习的漂亮应用程序。1.1.2 是一款专为机器学习工程师创建的免费、开源 app 构建框架。1.1.3 是...【详细内容】
2020-06-21  Tags: Streamlit  点击:(316)  评论:(0)  加入收藏
1 说明:=====1.1 是一个开源Python库,可轻松构建用于机器学习的漂亮应用程序。 1.2 我的第一篇文章,对其介绍、安装、初步相关使用做了详细的介绍:《Streamlit是python的一个机...【详细内容】
2020-06-21  Tags: Streamlit  点击:(443)  评论:(0)  加入收藏
如果有人告诉您可以使用150-200行代码创建交互式Web应用程序,该怎么办? 有趣的权利。 Streamlit为您提供了使用简单的python脚本和一些streamlit调用来创建漂亮的Web应用程序...【详细内容】
2020-06-16  Tags: Streamlit  点击:(622)  评论:(0)  加入收藏
▌简易百科推荐
在日常生活或工作中,我们或多或少用过一些非常“冷门”的数码电脑周边配线,比如:USB对拷线、USB延长线、网络延长线……这些配线虽然看似不起眼,但关键时刻却能解决...【详细内容】
2021-12-28  UNITEK优越者    Tags:数据线   点击:(1)  评论:(0)  加入收藏
大家好,我是成都刘老烧,最近两个月升级了8K设备多数的网友都叫我说说每一样产品的优缺点,所以今天这期我们就来聊聊我升级的一些HDMI2.1线,为未来即将要升级8K@60hz和4K@120hz的...【详细内容】
2021-12-28  成都刘老烧    Tags:HDMI   点击:(2)  评论:(0)  加入收藏
首先我们要弄懂什么是“雷电”接口。其实“雷电”本质上和咱们常见的HDMI,DP等一样是一种传输协议的简称,全程英文名叫做Thunderbolt。请注意与其说他是一个接口倒不如说他是...【详细内容】
2021-12-27  小伊评科技    Tags:雷电接口   点击:(10)  评论:(0)  加入收藏
畅谈关于装修的那些事,分享装修的各种经验和知识。大家好,我是畅谈装修,关注我即可了解更多关于装修的那些事!路由器现在已经是居家生活中“不可缺少的伙伴”,没有了它,相信连饭吃...【详细内容】
2021-12-27  畅谈装修    Tags:路由器   点击:(3)  评论:(0)  加入收藏
此前有关厂商销售的显示器上,HDMI 2.1的标示问题闹得沸沸扬扬。按照官方的说法,HDMI 2.0标准已经不存在了,以后只有HDMI 2.1标准,后者的功能是可选的,显示器制造商只要具体说明该...【详细内容】
2021-12-24  超能网    Tags:HDMI   点击:(11)  评论:(0)  加入收藏
声卡本身会包含一个DAC。DAC字面上直接翻译,就是“数字到模拟转换器”。有时候,人们认为声卡的DAC不够好,所以从声卡的数字输出接口,外接独立的DAC,来改善声音。DAC首选的接口是...【详细内容】
2021-12-10  亲爱的客户    Tags:解码器   点击:(15)  评论:(0)  加入收藏
1.为什么要有虚拟内存 在早期的计算机中,是没有虚拟内存的概念的。我们要运行一个程序,会把程序全部装入内存,然后运行。 当运行多个程序时,经常会出现以下问题: 1)进程地址空间...【详细内容】
2021-12-08  linux上的码农    Tags:虚拟地址   点击:(21)  评论:(0)  加入收藏
CPU、GPU、FPGA三者能力相加就是芯片的未来!很多粉丝问我,嵌入式方向中的FPGA怎么样?收入如何?前言讲述FPGA前,我们先讲讲当年中兴被制裁的问题。美国前总统特朗普曾经发布过一条...【详细内容】
2021-12-01  一口Linux    Tags:FPGA   点击:(52)  评论:(0)  加入收藏
现在市面上常用的视频线有HDMI线、VGA线、DP线、DVI线,其中HDMI线是用的比较多的,平时直播也有很多朋友会问HDMI相关的问题,今天小泽总结了一些高频的HDMI使用问题,赶紧收藏! 所...【详细内容】
2021-11-25  SAMZHE山泽    Tags:HDMI线   点击:(32)  评论:(0)  加入收藏
本内容来源于@什么值得买APP,观点仅代表作者本人 |作者:殇小辛 apple tv 4K使用近2年了,分享下深度使用体验 整个盒子比想象中小很多,放在电视柜里不占空间,还很好看 遥控器顶部区...【详细内容】
2021-11-09  什么值得买    Tags:Apple TV   点击:(31)  评论:(0)  加入收藏
相关文章
    无相关信息
最新更新
栏目热门
栏目头条