Python Dash 模块

2025年3月17日 | 阅读 8 分钟

我们都一定多次听说过 Python 是一种动态类型编程语言，但我们可能并非所有人都知道 Python 也可以用于 Web 开发。是的，没错，我们可以使用 Python 进行 Web 开发，Python 中有许多模块可以帮助我们完成这项任务。在本教程中，我们将讨论一个这样的 Python 模块，即 Dash 模块，它有助于我们使用 Python 执行 Web 开发任务。我们将首先介绍 Dash 模块，然后使用 Python Dash 模块构建一个基本的仪表板和 Web 应用程序。

Python Dash 模块简介

Dash 是一个 Python 模块或框架，用于创建许多分析性 Web 应用程序，我们可以使用 Dash 框架构建分析性仪表板。借助 Dash 模块，我们可以轻松创建非常快速且响应迅速的 Web 仪表板，这些仪表板也具有出色的用户界面。当使用 Dash 模块时，我们可以在没有任何先验知识的情况下构建这些交互式 Web 仪表板，而无需了解 JavaScript、HTML、CSS 等任何强制性的复杂前端 Web 框架。

现在，我们已经了解了 Dash 模块是什么以及完成了它的介绍部分；是时候使用 Dash 模块构建我们的第一个仪表板了。但是，在构建 Web 应用程序或仪表板之前，我们必须在系统中安装 dash 模块（因为它不是 Python 的内置模块）。一旦该模块的安装过程完成，我们将继续进行 Dash 模块的应用程序部分。

Dash 模块安装

在本节中，我们将学习如何在系统中安装 Dash 模块，以便我们可以将其导入 Python 程序并使用其函数作为 Web 框架。我们需要遵循以下步骤在系统中安装 Dash 模块。

步骤 1：打开设备的命令提示符终端，并使用 `mkdir` 命令定位 Python 安装在系统中的目录。

步骤 2：现在，在终端中输入以下命令，使用 pip 安装程序安装 Dash 模块。

步骤 3：当我们按 Enter 键时，pip 安装程序将开始在我们定义的路径下的系统中安装 Dash 模块。

正如我们所见，Dash 模块已成功安装在我们的系统中，现在我们可以通过将其导入程序来开始使用它。

Dash 模块的应用

我们现在将通过构建一个基本的仪表板来学习 Dash 模块的应用，之后，我们还将使用回调函数构建一个 Web 应用程序，以便可以在其中使用分析功能。借助这两个基本实现，我们将了解如何使用 Dash 框架构建非常快速且具有出色 UI 的 Web 应用程序。

在本部分中，我们将使用 Dash 模块创建以下两个简单的 Web 应用程序：

一个基本的仪表板
带回调的 Web 应用程序

创建基本仪表板

在本节中，我们将在 Python 模块中使用 Dash 模块库及其函数来创建一个简单的 Web 仪表板。本节中我们将创建的仪表板将是一个简单、静态但响应式的 Web 仪表板。在仪表板中，我们将使用 Dash 模块在网页上构建一个静态且响应式的图表。

我们将通过遵循以下所有步骤来使用 Dash 模块构建一个简单的仪表板：

步骤 1：导入所有必需的库

首先，我们必须在 Python 程序中导入所有必需的库，以便我们可以使用构建仪表板所需的所有函数。我们首先需要在程序中导入以下 Dash 库组件：

Dash 库
Dash 核心组件
Dash HTML 组件

我们可以使用以下代码在 Python 程序中导入上述所有必需的库：

# Importing dash library as dsh
import dash as dsh
# Importing dash core components as dc2
import dash_core_components as dc2
# Importing html components from the dash 
import dash_html_components as dhc

Dash 核心组件为我们提供了 Dash 的以下核心组件：

输入
图表
按钮等。

Dash HTML 组件包含以下 HTML 函数组件：

段落标签
正文标签
Meta 标签等。

步骤 2：设计布局

在此步骤中，我们将使用 Dash 的 HTML 组件、核心组件和库函数为我们正在构建的 Web 应用程序设计布局。创建布局后，我们将创建一个图表，该图表将具有各种参数。以下是我们将在使用 Dash HTML 组件创建图表时使用的一些参数：

figure（这将是图表本身）
id（通过这个，我们将为特定的图表分配一个唯一的 ID）
layout（它包括图表的基本布局、X 和 Y 轴的数据、图表的标题等）

现在，查看上面的代码部分，我们在其中为 Web 应用程序创建了布局和图表：

# Initializing a variable for web application
webApp = dsh.Dash()
# Creating layout for the dashboard
webApp.layout = dhc.Div(children =[ 
    dhc.H1("Tutorial on building a web application using Dash"), # Title of the page
    dc2.Graph( 
        id ="graphExample", # ID of graph
        figure ={ # Creating Graph figure
            'data':[ 
                       {'x':[1, 3, 5, 7, 9, 11, 13], 
                        'y':[7, 6, 8, 4, 5, 9, 3], 
                        'type':'line',  
                        'name':'Trucks'}, 
                       {'x':[1, 3, 5, 7, 9, 11, 13],  
                        'y':[6, 5, 7, 3, 4, 8, 2],  
                        'type':'bar', 
                        'name':'Ships'} 
                   ], 
            'layout':{ # Layout of the graph
                'title':'A Basic Graph for Dashboard' # Title of the graph
            } 
        } 
    ) 
])

在上面的程序中，我们有 html 组件，如 `dhc.h1` 或 `dhc.div`，它们实际上类似于 HTML 中的组件，其中 `dhc.h1` 类似于 HTML 中的标题，`dhc.div` 类似于 HTML 中的 div class。我们还可以从上面程序的部分解释以下几点：

我们可以轻松理解，figure 参数本质上是一个字典，我们可以在其中定义 name、type、x、y 等元素。
我们在上面代码中使用的 name 参数是指与图表轴关联的名称。
我们使用的 type 参数是指我们想在仪表板中显示的图表类型，它可以是折线图、条形图等。
x 和 y 可以是单个值或值列表（其中 x 和 y 中的值分别指的是 X 轴和 Y 轴）。

步骤 3：创建服务器

创建布局后，仪表板就完全准备好了，但我们需要一个服务器来运行它。因此，现在我们将使用程序中的以下代码部分设置一个服务器，并在创建的服务器上运行仪表板。

# Creating a server for the dashboard to run on it
if __name__ == '__main__': 
    webApp.run_server()  

当我们运行程序时，它将在输出中显示默认端口链接，我们必须在默认浏览器中打开它并运行其中的链接，才能看到我们构建的 Web 应用程序。

输出

我们可以看到，我们已经创建了一个 Web 应用程序，一个基本的静态 Web 应用程序。在这个 Web 应用程序中，用户无法控制该应用程序，我们也无法从用户那里获取输入。这就是为什么我们将构建一个 Web 应用程序，在该应用程序中使用回调函数（Dash 提供）来获取用户输入并根据输入给出结果。

使用 Dash 回调创建 Web 应用程序

在本节中，我们将像创建基本仪表板时一样，使用 Dash 函数和 Dash 组件创建 Web 应用程序。但是，我们还将使用 Dash 的回调来创建应用程序，以便我们可以在构建的仪表板中获取用户输入。在这里，我们不会像之前那样逐步构建 Web 应用程序。我们将首先查看上面程序，其中我们创建了一个带有回调的 Web 应用程序，然后我们将理解程序中函数和回调的实现。

# Importing dash library as dsh
import dash as dsh
# Importing dash core components as dc2
import dash_core_components as dc2
# Importing html components from dash 
import dash_html_components as dhc
# Importing dependencies for using input & output
from dash.dependencies import Input, Output
webApp = dsh.Dash() 
# Layout for the application
webApp.layout = dhc.Div(children = [
    # Using input to take input
    dc2.Input(id = 'input'), 
    # Creating div class for output     
    dhc.Div(id ='output') 
])
# Using dash callback for input and output
@webApp.callback( 
# Returning the output
    Output(component_id = 'output', component_property = 'children'), 
 # Taking the input value 
    [Input(component_id = 'input', component_property = 'value')] 
) 
 # A default function to perform operation with input value
def update_value(input_data): 
    try:     
        return str(float(input_data) ** 3)  # Cube of Input value
    except:     
        return "Error, the input value given is not a numeric value"  # If the input value is not a number
# Creating a server for the dashboard to run on it
if __name__ == '__main__': 
    webApp.run_server() 

当我们运行上面的程序时，服务器将把我们重定向到 localhost 的默认端口 8050，我们必须在系统的默认浏览器中打开它，以便可以看到 Web 应用程序。

输出

当我们运行服务器并在 Web 浏览器中以默认端口打开 Web 应用程序仪表板时，应用程序会要求输入一个值。当我们输入一个值到框中时，应用程序将计算给定数字的立方，并将操作结果作为输出值给出（我们可以在输出图片中看到这一点）。

说明

在上面的示例中，我们使用了与第一个示例中类似的逻辑，但我们也使用了许多不同的函数和逻辑。首先，我们在此函数中导入了一个额外的库，即 `dash dependencies`，以便在 Web 应用程序中使用输入和输出函数。在创建布局时，这里我们创建了一个对话框，我们在其中定义了输入和输出的 division class。之后，我们使用了 dash callback，以便我们可以从用户那里获取输入并对其执行操作以产生输出，其中输出将是操作的结果。我们使用了异常处理，以便如果输入值不是数字，我们可以引发错误。最后，我们创建了一个服务器并在其上运行了应用程序。

结论

在本教程中，我们有两个 Web 应用程序，一个带有静态图表，另一个使用 Dash 的回调。也许这些 Web 应用程序对我们没有用，但通过这些 Web 应用程序的实现，我们现在可以理解 Dash 库的功能以及如何使用 Dash 模块构建 Web 应用程序。

下一主题Python Emoji 模块

← 上一个下一个 →

Python Dash 模块