Streamlit颜色选择器

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库，你可以在终端或命令提示符中使用以下命令。

pip install streamlit

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

导入库

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

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

import streamlit as st
import matplotlib.pyplot as plt
import pandas as pd
import numpy as np

创建数据

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

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

np.random.seed(42)

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

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()来分配。我们只需要传入一个标签名称。

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变量。

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应用程序。为此，我们需要在终端中输入以下内容：

streamlit run app.py

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

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

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

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

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

user_colour = st.color_picker(label='Choose a colour for your plot', 
                              value='#1F9A2E')

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

总结

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