我們肯定都聽說過很多次 Python 是一種動態類型的編程語言,但是不是所有人都知道我們也可以將 Python 用於網路開發。是的,這是正確的,我們可以使用 Python 進行網路開發,Python 中有許多模塊可以幫助我們完成這項任務。在本教程中,我們將討論一個這樣的 Python 模塊,即 Dash 模塊,它幫助我們使用 Python 執行 web 開發任務。我們將首先看一下 Dash 模塊的介紹,然後我們將使用 Python dash 模塊構建一個基本的儀錶板和 web 應用。
Python 破折號模塊介紹
Dash 是一個 Python 模塊或框架,用於創建許多分析 web 應用,我們可以使用 dash 框架構建分析儀錶板。在 Dash 模塊的幫助下,我們可以輕鬆地創建非常快速和響應迅速的網路儀錶板,這也是非常好看的(擁有一個偉大的用戶界面)。當我們使用 Dash 模塊時,我們可以構建這些互動式網路儀錶板,而無需事先了解一些強制性的複雜前端網路框架,如 JavaScript、HTML、CSS 等。
現在,我們已經了解了 Dash 模塊是什麼,並完成了它的介紹部分;是時候我們應該使用 Dash 模塊構建我們的第一個儀錶板了。但是,在使用 dash 框架構建 web 應用或儀錶板之前,我們必須在系統中安裝 Dash 模塊(因為它不是 Python 中的內置模塊)。一旦該模塊的安裝過程完成,我們將進入 Dash 模塊的應用部分。
儀錶板模塊的安裝:
在這一節中,我們將學習如何在我們的系統中安裝 Dash 模塊,以便我們可以將其導入 Python 程序及其函數,從而將其用作 web 框架。我們必須按照以下步驟在系統中安裝 Dash 模塊:
第一步:打開設備的命令提示終端,找到系統中安裝 Python 的目錄(使用 mkdir 命令)。
第二步:現在在終端寫下以下命令,用 pip 安裝程序安裝 Dash 模塊:
pip install dash
第三步:當我們按回車鍵時,pip 安裝程序將開始在系統中我們定義的路徑上安裝 Dash 模塊。
正如我們所看到的,Dash 模塊已經成功安裝在我們的系統中,現在我們可以通過將其導入到程序中來開始使用它。
儀錶板模塊的應用
現在,我們將通過構建一個基本的儀錶板來學習 Dash 模塊的應用,之後,我們還將使用回調來構建一個網路應用,以便我們可以在其中使用分析功能。在這兩個基本實現的幫助下,我們將學習如何使用 dash 框架來構建速度非常快並且具有非常好的 UI 的 web 應用。
在本部分中,我們將使用 Dash 模塊創建以下兩個簡單的 web 應用:
- 基本儀錶板
- 帶有回調的 Web 應用
創建基本儀錶板:
在本節中,我們將使用一個 Python 模塊中的 Dash 模塊庫及其功能創建一個簡單的 web 儀錶板。我們將在本節中創建的儀錶板將是一個簡單、靜態但響應迅速的網路儀錶板。在儀錶板中,我們將使用 dash 模塊在網頁上構建一個靜態的響應圖。
我們將按照下面給出的所有步驟,使用 Dash 模塊構建一個簡單的儀錶板:
第一步:導入所有需要的庫:
首先,我們必須在 Python 程序中導入所有必需的庫,這樣我們就可以使用所有必需的功能來構建儀錶板。我們首先要在程序中導入以下 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 核心組件:
- 輸入
- 圖形
- 按鈕等。
並且破折號 HTML 組件具有以下 HTML 功能組件:
- 段落標籤
- 正文標籤
- Meta 標籤等。
第二步:設計布局:
在這一步中,我們將使用 Dash 的 HTML 組件、核心組件和庫函數為我們正在構建的 web 應用設計一個布局。創建布局後,我們將製作一個圖形,我們創建的圖形將有各種參數。以下是我們在使用 Dash HTML 組件創建圖形時將使用的參數:
- 圖(將是圖表本身)
- id(通過這種方式,我們將為特定的圖形分配一個唯一的 ID)
- 布局(包括圖形的基本布局、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
}
}
)
])
在上面的程序中,我們有像 dhc.h1 或 dhc.div 這樣的 html 組件,實際上就像 HTML 中的組件,其中 dhc.h1 像 HTML 中的標題,dhc.div 像 HTML 中的 div 類。我們還可以從節目的上述部分解讀以下幾點:
- 我們很容易理解圖形參數本質上是一個字典,我們可以在其中定義像名稱、類型、x、y 等元素。
- 我們在上面的代碼中使用的名稱參數是指與圖的軸相關聯的名稱。
- 我們使用的類型參數是指我們希望在儀錶板中投影的圖形類型,它可以是直線、條形等。
- 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 應用中,用戶不能控制應用,我們甚至不能接受用戶的輸入。這就是為什麼我們要構建一個網路應用,我們使用回調(在 Dash 中提供)從用戶那裡獲取輸入,並根據它給出結果。
使用 Dash 回調創建網路應用:
在本節中,我們將使用 Dash 的 Dash 功能和組件創建一個網路應用,就像我們在創建基本儀錶板時使用的那樣。但是我們也將使用 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()
當我們運行上述程序時,伺服器會將我們重定向到默認埠為 8050 的 localhost,我們必須在系統的默認瀏覽器中打開它,這樣我們才能看到 web 應用。
輸出:
當我們運行伺服器並用默認埠在 web 瀏覽器中打開 web 應用儀錶板時,應用要求輸入值。當我們在框內給出輸入值時,應用將計算給定數字的立方,並將運算結果作為輸出值給出(我們可以在輸出圖像中看到這一點)。
說明:
在上面的例子中,我們使用了與第一個例子相似的邏輯,但是我們也使用了許多不同的函數和邏輯。首先,我們在這個函數中導入了一個額外的庫,即 dash dependencies,以在 web 應用中使用輸入和輸出函數。在創建布局時,我們在這裡創建了一個對話框,在其中定義了輸入和輸出劃分類。之後,我們使用 dash 回調,這樣我們就可以從用戶那裡獲取輸入,並對其執行操作,以生成輸出,其中輸出將是操作的結果。我們使用了異常處理,這樣如果輸入值不是數字,我們就可以引發錯誤。最後,我們創建了一個伺服器,並在其上運行應用。
結論
在本教程中,我們有兩個 web 應用,其中一個是靜態圖,另一個使用 dash 的回調。也許這些 web 應用對我們來說並沒有什麼用處,但是藉助這些 web 應用的實現,我們現在可以了解 Dash 庫的功能以及如何使用 Dash 模塊來構建 web 應用。
原創文章,作者:XAIBE,如若轉載,請註明出處:https://www.506064.com/zh-tw/n/127511.html