前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Streamlit颜色选择器

Streamlit颜色选择器

作者头像
磐创AI
发布2024-04-15 17:11:20
1090
发布2024-04-15 17:11:20
举报
Streamlit是一个流行且强大的基于Python的开源框架,允许你快速轻松地创建交互式数据科学仪表板并部署机器学习模型。

Streamlit的一个有用功能是颜色选择器工具。这使你可以通过让用户选择任何颜色,而不是使用默认的硬编码颜色,为你的仪表板添加灵活性。

这个简短的教程将向你展示如何在仪表板内部轻松实现Streamlit颜色选择器小部件。

如果你是第一次接触Streamlit,你可能想查看我的以前的Streamlit教程,以帮助你入门:

  • 从零开始创建基于Web的Streamlit应用:https://towardsdatascience.com/getting-started-with-streamlit-web-based-applications-626095135cb8
  • 创建真正的多页面Streamlit应用 - 新方法(2022):https://towardsdatascience.com/creating-true-multi-page-streamlit-apps-the-new-way-2022-b859b3ea2a15
  • 初学Streamlit:入门时需要了解的5个函数:https://towardsdatascience.com/getting-started-with-streamlit-5-functions-you-need-to-know-when-starting-out-b35ed7d872b9
安装Streamlit

如果你尚未安装Streamlit库,你可以在终端或命令提示符中使用以下命令。

代码语言:javascript
复制
pip install streamlit

安装完Streamlit后,我们可以创建一个名为app.py的新文件。这就是我们将添加代码的地方。

导入库

第一步是导入一些库:Streamlit、numpy、pandas和matplotlib。

我们将使用numpy和pandas创建一些示例数据,并使用matplotlib生成该数据的散点图。

代码语言:javascript
复制
import streamlit as st
import matplotlib.pyplot as plt
import pandas as pd
import numpy as np
创建数据

接下来,我们需要创建一些虚拟数据,以DataFrame的形式存在。

为此,我们首先创建一个包含100行和3列的0到100之间的随机整数的numpy数组。这将为我们提供足够在图上显示的数据。还要注意,每次使用这个函数重新运行应用程序时,数据都会更改。如果我们不希望发生这种情况,我们需要添加一行代码来设置随机种子。

代码语言:javascript
复制
np.random.seed(42)

然后,我们将此数组传递到pd.DataFrame,并将字母A、B和C分配为列名。这将在以后引用这些列时更加方便。

代码语言:javascript
复制
arr_random = np.random.randint(low=0, high=100, size=(100,3)) 0, high=100, size=(100,3)) 

data_to_plot = pd.DataFrame(arr_random, columns=["A","B","C"])
设置Streamlit页面

接下来的部分是设置我们的Streamlit应用程序。对于这个示例,我们将保持非常基本。

首先,我们将创建一个标题st.header(),然后创建一个新变量来存储用户的颜色选择。这个变量通过st.color_picker()来分配。我们只需要传入一个标签名称。

代码语言:javascript
复制
st.header('Streamlit Colour Picker for Charts')'Streamlit Colour Picker for Charts')

user_colour = st.color_picker(label='Choose a colour for your plot')

要了解有关颜色选择器小部件的更多信息,请查看下面的文档页面。

https://docs.streamlit.io/library/api-reference/widgets/st.color_picker?

设置Matplotlib图形

现在,我们需要使用matplotlib创建我们的图形。这可以通过设置fig和ax变量,并将它们分配给plt.subplots()来实现。在这个函数中,我们只需要传入1,1,以表示我们正在创建一个有1行和1列的图形。

接下来,我们将调用ax.scatter,并将上面创建的user_colour变量传递给c(颜色)参数。

最后,为了让Streamlit显示matplotlib的散点图,我们需要调用st.pyplot(),并传入fig变量。

代码语言:javascript
复制
fig, ax = plt.subplots(1,1)
ax.scatter(x=data_to_plot['A'], y=data_to_plot['B'], c=user_colour)

st.pyplot(fig)
运行Streamlit应用程序

现在基本代码已经编写完毕,我们可以运行Streamlit应用程序。为此,我们需要在终端中输入以下内容:

代码语言:javascript
复制
streamlit run app.py

然后它将在你的默认浏览器中启动Streamlit。

启动后,我们将看到带有颜色选择器工具和matplotlib图形的基本应用程序。

带有基本matplotlib图形和颜色选择器的Streamlit应用程序。图片由作者提供。要更改颜色,我们需要点击颜色框并选择新颜色。一旦点击颜色选择器框外部,图表将会使用新颜色进行更新。

将Streamlit颜色选择器的默认值设置为默认值

默认情况下,颜色选择器将设置为黑色(#000000)。我们可以通过将我们自己的十六进制代码传递给st.color_picker()函数的value参数来进行设置。

代码语言:javascript
复制
user_colour = st.color_picker(label='Choose a colour for your plot', 
                              value='#1F9A2E')

下次启动应用程序时,选择器的颜色将默认为设置的值。

总结

在这个简短的教程中,我们看到了如何在Streamlit仪表板中添加一个交互式的颜色选择器。这样可以避免硬编码颜色,使你能够为仪表板用户提供更多的灵活性。实现起来非常简单,可以为你的Streamlit创建增加更多的可用性。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2024-04-09,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 磐创AI 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 安装Streamlit
  • 导入库
  • 创建数据
  • 设置Streamlit页面
  • 设置Matplotlib图形
  • 运行Streamlit应用程序
  • 将Streamlit颜色选择器的默认值设置为默认值
  • 总结
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档