Python製作視覺化報表的範例詳解

2022-02-23 13:07:32

大家好，我是小F～

在資料展示中使用圖表來分享自己的見解，是個非常常見的方法。

這也是Tableau、Power BI這類商業智慧儀表盤持續流行的原因之一，這些工具為資料提供了精美的圖形解釋。

當然了，這些工具也有著不少缺點，比如不夠靈活，無法讓你自己建立設計。

當你對圖表展示要求客製化化時，程式設計也許就比較適合你，比如Echarts、D3.js。

今天小F給大家介紹一個用Python製作視覺化報表的案例，主要是使用到Dash+Tailwindcss。

視覺化報表效果如下，水果銷售情況一覽~

Dash是基於Plotly搭建的Dashbord框架，支援Python、R和Julia。使用Dash，你可以建立自定義響應式儀表板。

相關檔案

說明：https://dash.plotly.com/introduction

案例：https://dash.gallery/Portal/

Tailwindcss則是一個實用程式優先的CSS框架，用於快速構建自定義介面。

“這種框架只適用於那種只會實現頁面佈局美化元素而不關心實現業務邏輯的前端”。

看看別人對它的評價，對於無互動的圖表，完全足夠了。

相關檔案

說明：https://www.tailwindcss.cn/docs

下面就給大家講解下如何通過Dash+Tailwindcss搭建視覺化報表～

首先安裝相關的Python庫，然後匯入。

import dash
import pandas as pd
import plotly.express as px
from dash import dcc, html

使用到了Pandas、Plotly、dash這三個Python庫。

我們需要把Tailwindcss的CDN作為external_script，並將其傳遞給我們的應用程式範例，這樣我們才可以成功使用Tailwindcss。

# 匯入tailwindcss的CDN
external_script = ["https://tailwindcss.com/", {"src": "https://cdn.tailwindcss.com"}]
 
# 建立Dash範例
app = dash.Dash(
    __name__,
    external_scripts=external_script,
)
app.scripts.config.serve_locally = True

使用Pandas建立水果銷售資料，隨便虛構了一個。

# 建立資料
df = pd.DataFrame(
    {
        "Fruit": ["蘋果", "橙子", "香蕉", "蘋果", "橙子", "香蕉"],
        "Amount": [4.2, 1.0, 2.1, 2.32, 4.20, 5.0],
        "City": ["北京", "北京", "北京", "上海", "上海", "上海"],
    }
)
 
print(df)

結果如下，3列6行，包含水果、銷售額、城市列。

處理一下相關的資料，水果單數、銷售總額、城市單數、變數數。

# 水果單數
fruit_count = df.Fruit.count()
# 銷售總額
total_amt = df.Amount.sum()
# 城市單數
city_count = df.City.count()
# 變數數
variables = df.shape[1]

建立圖表範例，一個柱狀圖、一個箱型圖。

# 柱狀圖1, 不同水果不同城市的銷售額
fig = px.bar(df, x="Fruit", y="Amount", color="City", barmode="group")
 
# 箱型圖1, 不同城市的銷售額分佈情況
fig1 = px.box(df, x="City", y="Amount", color="City")

效果如下。

剩下就是文字模組啦，文字+CSS樣式。

其中排版佈局美化，通過Tailwindcss來實現。

app.layout = html.Div(
    html.Div(
        children=[
            html.Div(
                children=[
                    html.H1(children="水果銷售--視覺化報表", className=" py-3 text-5xl font-bold text-gray-800"),
                    html.Div(
                        children="""Python with Dash =

Python製作視覺化報表的範例詳解

熱門文章