Python套件 on IT 空間

透過 Docling 輕鬆解析常見文件，匯出成 JSON、Markdown、HTML 格式

jia@jiatool.com (Jia) — Sat, 01 Feb 2025 17:00:00 +0800

前言

去年底 (2024/11) IBM 最新開源 Docling 工具 (Python 套件)，可以讀取一些常見的文件格式（PDF、DOCX、PPTX、XLSX、圖片、HTML、Markdown…）並匯出成 JSON、Markdown、HTML，以及對 PDF 裡的頁面佈局、表格、公式、程式碼…等等有較好的理解，而且也支援 OCR 辨識。

我還沒有做太多測試、比較，只是做個簡單的紀錄。

安裝套件

安裝很簡單，透過 pip 安裝：

1

pip install docling

* 本文使用 Docling 版本為：v2.17.0

使用教學 & 範例程式碼

簡單三步驟：設定來源、轉換文件、輸出結果

設定文件來源

Docling 支援多種格式：PDF、DOCX、PPTX、XLSX、Image、HTML、Markdown、AsciiDoc
參考：https://docling-project.github.io/docling/usage/supported_formats/

輸入可以是網址或本地檔案路徑：

1
2
3


source = "https://arxiv.org/pdf/2412.16720" # PDF path or URL
source = "./docs/測試用.pdf"
source = "./docs/測試用2.docx"

轉換文件

將文件轉換成它定義的 DolingDocument 格式，就會包含文件的像是檔名、文字、表格、圖片…等等資訊。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35


# 簡單快速使用
converter = DocumentConverter()
# 也可以限制轉換格式
# converter = DocumentConverter(
# allowed_formats=[InputFormat.PDF, InputFormat.IMAGE, InputFormat.DOCX, InputFormat.PPTX, InputFormat.MD, InputFormat.HTML, InputFormat.ASCIIDOC],
# format_options={
# InputFormat.PDF: PdfFormatOption(
# pipeline_cls=StandardPdfPipeline, backend=PyPdfiumDocumentBackend
# ),
# InputFormat.DOCX: WordFormatOption(
# pipeline_cls=SimplePipeline # , backend=MsWordDocumentBackend
# ),
# },
# )
# 預測模型會在首次使用時自動下載，也可以指定事先下載好的資料夾路徑
# 在離線環境方便使用
# 模型可能是這邊下載：https://huggingface.co/ds4sd/docling-models
# 我也不太確定
# pipeline_options = PdfPipelineOptions(artifacts_path="your location")
# converter = DocumentConverter(
# format_options={
# InputFormat.PDF: PdfFormatOption(pipeline_options=pipeline_options)
# }
# )
# pipeline
# https://docling-project.github.io/docling/usage/#adjust-pipeline-features
# 開始轉換文件
result = converter.convert(source)
# 也可以限制文件頁數和大小
# result = converter.convert(source, max_num_pages=10, max_file_size=20971520)

輸出結果

將轉換後的文件輸出成不同的格式，像是純文字、HTML、Markdown 和 JSON：

1
2
3
4
5
6
7


print(result.document.export_to_text())
print(result.document.export_to_dict()) # json
print(result.document.export_to_html())
print(result.document.export_to_markdown())
print(result.document.export_to_document_tokens())
# print(result.document.print_element_tree())
# print(result.document._export_to_indented_text(max_text_len=16))

也可以直接儲存成檔案：

1
2
3
4
5
6
7


from pathlib import Path
result.document.save_as_markdown(filename=Path("./docs/test.md"))
result.document.save_as_html(filename=Path("./docs/test.html"))
result.document.save_as_json(filename=Path("./docs/test.json"))
result.document.save_as_document_tokens(filename=Path("./docs/test.tokens"))
result.document.save_as_yaml(filename=Path("./docs/test.yaml"))

完整範例程式碼

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66


import json
from pathlib import Path
from docling_core.types import DoclingDocument
from docling.datamodel.base_models import InputFormat
from docling.document_converter import (
DocumentConverter,
PdfFormatOption,
WordFormatOption,
)
from docling.datamodel.pipeline_options import PdfPipelineOptions
from docling.pipeline.simple_pipeline import SimplePipeline
from docling.pipeline.standard_pdf_pipeline import StandardPdfPipeline
from docling.backend.pypdfium2_backend import PyPdfiumDocumentBackend
# source = "https://arxiv.org/pdf/2408.09869" # PDF path or URL
# source = "./docs/OpenAIo1SystemCard.pdf.pdf"
source = "./docs/測試文件.docx"
converter = DocumentConverter()
# # 可以限制轉換格式
# converter = DocumentConverter(
# allowed_formats=[InputFormat.PDF, InputFormat.IMAGE, InputFormat.DOCX, InputFormat.PPTX, InputFormat.MD, InputFormat.HTML, InputFormat.ASCIIDOC],
# format_options={
# InputFormat.PDF: PdfFormatOption(
# pipeline_cls=StandardPdfPipeline, backend=PyPdfiumDocumentBackend
# ),
# InputFormat.DOCX: WordFormatOption(
# pipeline_cls=SimplePipeline # , backend=MsWordDocumentBackend
# ),
# },
# )
# 開始轉換文件
result = converter.convert(source)
# 也可以限制文件頁數和大小
# result = converter.convert(source, max_num_pages=10, max_file_size=20971520)
# 輸出結果
# print(result.document.export_to_text())
print(result.document.export_to_dict())
# print(result.document.export_to_html())
# print(result.document.export_to_markdown())
# print(result.document.export_to_document_tokens())
# print(result.document.print_element_tree())
# print(result.document._export_to_indented_text(max_text_len=16))
# 直接儲存成檔案
# result.document.save_as_markdown(filename=Path("./docs/test.md"))
# result.document.save_as_html(filename=Path("./docs/test.html"))
# result.document.save_as_json(filename=Path("./docs/test.json"))
# result.document.save_as_document_tokens(filename=Path("./docs/test.tokens"))
# result.document.save_as_yaml(filename=Path("./docs/test.yaml"))
# 另一種方法，儲存與讀取
# # Save to disk
# with open('./docs/test.json', 'w', encoding='utf-8') as fp:
# json.dump(doc.export_to_dict(), fp, ensure_ascii=False) # use `export_to_dict` to ensure consistency
# # Load from disk
# with open('./docs/test.json', 'r', encoding='utf-8') as f:
# doc_dict = json.load(f)
# doc = DoclingDocument.model_validate(doc_dict) # use standard pydantic API to populate doc

切割 chunk

另外 Docling 也內建切 chunk 的函式，在做 RAG 時會使用到：https://docling-project.github.io/docling/examples/hybrid_chunking/

1
2
3
4
5
6
7
8


# 切 chunk
from docling.document_converter import DocumentConverter
from docling_core.transforms.chunker import HierarchicalChunker # 分層分塊器
conv_res = DocumentConverter().convert("https://arxiv.org/pdf/2206.01062")
doc = conv_res.document
chunks = list(HierarchicalChunker().chunk(doc))
print(chunks[30])

其他

官方文件內有示範多種範例，可以探索還有哪些使用方法：https://docling-project.github.io/docling/examples/

結語

除了 Docling，其他類似功能的套件還有像是 unstructured 、 MarkItDown 、
PyMuPDF4LLM 、 MinerU …，我有空應該也會找時間來試試看。

參考：
Docling 官方文件
 Docling GitHub
ds4sd/docling-models | Hugging Face

Embrace the unknown and embrace change. That’s where true breakthroughs happen.
擁抱未知，擁抱變化。那才是真正的突破所在！

—— 黃仁勳 (NVIDIA 共同創辦人暨執行長)

Streamlit 使用 Nginx 佈署在網址其他路徑

jia@jiatool.com (Jia) — Sat, 09 Nov 2024 20:40:00 +0800

前言

當使用 Streamlit 做出一個 web app 之後，除了佈署到 Streamlit Community Cloud，我們也可以自己佈署 (例如使用 Docker、Kubernetes)。

* 之前寫的文章： (2023年新版) 使用 Streamlit 簡單又快速建立 Dashboard 網頁

最近剛好有這需求，但我不是要起在根路徑(/)，而是要指定其他路徑(例如 /myapp)，這部分會透過 Nginx 去設定。

不過找了幾篇網路文章，卻還是設定不起來，所以把最終成功的設定分享出來，讓大家少踩一些坑。

設定細節

我需要設定，當其他電腦連到這台主機的某個路徑 (例如 https://mysite.com/myapp)，它可以轉到 Streamlit app 的 port (例如 http://localhost:8000)。

環境

我是在 Windows 11 裡的 WSL (Linux 系統) 起 Docker 環境，裡面跑 Streamlit app。

並在 Windows 底下起 Nginx server (v1.24.0)，讓公司內其他電腦可以連到這台的 localhost。

Nginx 設定

因為 Streamlit 有用到 WebSocket，所以還需要多加幾行相關設定。

WebSocket 是一種網路傳輸協定，用來在 Server 和 Client 之間建立「持續的雙向通訊」通道，是持續的連線，Server 可以主動向 Client 發送資料，而不需要等待 Client 發出請求。
這使得 WebSocket 特別適合用於即時應用場景，比如即時聊天、線上遊戲等。

設定 nginx.conf 檔案，這個檔案可以到 nginx 安裝路徑、/usr/local/nginx/conf、/etc/nginx、/usr/local/etc/nginx 找找。

http {
...
map $http_upgrade $connection_upgrade {
default upgrade;
'' close;
}
server {
listen 80;
listen 443 ssl;
ssl_certificate "(省略)/conf/certs/demo.pem";
ssl_certificate_key "(省略)/conf/certs/demo.key";
# Streamlit app
location /myapp {
proxy_pass http://localhost:8000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $connection_upgrade;
}
}
}

# Streamlit app 的部分我還有看到另外一種設定，但在此案例應該沒差(?)：

 location /myapp/_stcore/stream {
proxy_pass http://localhost:8000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $connection_upgrade;
}
location /myapp {
proxy_pass http://localhost:8000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}

Streamlit 指令

這邊是一大重點，因為找到的文章很多都是在說 Nginx 設定，而沒有提到 streamlit run 也要帶相關參數：

1

streamlit run streamlit.py --server.port 8000 --server.enableCORS false --server.enableXsrfProtection false --server.baseUrlPath "myapp"

題外話，可以關閉將使用情況統計資料傳送給 Streamlit：

1

--browser.gatherUsageStats false

結語

雖然我不知道這樣設定是不是最好的，但至少對我有效 (🤣

我把找到的幾篇文章都貼在下方參考連結，如果以上的方法還是幫不了你，可以去參考連結翻翻試試。

參考：
config.toml | Streamlit API reference
How to use Streamlit with Nginx? | Streamlit Discuss
Deploy Streamlit with NGINX with SSL | Streamlit Discuss
Deploy streamlit with nginx + docker | Streamlit Discuss
Run streamlit app on specific URL path | Streamlit Discuss

平靜的海面造就不出優秀的水手。

(2023年新版) 使用 Streamlit 簡單又快速建立 Dashboard 網頁

jia@jiatool.com (Jia) — Sun, 17 Sep 2023 21:35:00 +0800

前言

之前寫這篇 Streamlit 的教學文章已經過去兩年多了，陸續官方還增加了許多功能與優化，而且從我部落格後台的數據來看，發現那篇文章還蠻多人觀看。因此決定再寫篇更新的內容，並多補充一些細節。

此篇文章使用的 Streamlit 是 v1.26.0 版本。

Streamlit 幫助我們快速製作 Web 應用程式，而且不需要任何前端技能，全部都採用 Python 語法完成。讓你輕鬆分享網路爬蟲、數據科學和機器學習的資料，是一個非常方便的套件。

* 文章最後會附上完整的範例程式碼，請一定看到最後~

Demo

這是最後將程式碼放到 GitHub，並使用 Streamlit Cloud 部署的成果。

Streamlit 成果範例：streamlit_2023_demo

Streamlit Demo 範例

安裝與執行

Streamlit [ 官方網站 ] [ 官方文檔 ]

安裝

1

pip install streamlit

撰寫本篇文章時最新版為：v1.26.0

執行

1
2
3
4


streamlit run <py程式檔案路徑>
# 以我下方文章範例的話，就是：
streamlit run streamlit_app.py

如果想指定 Streamlit 的 port 埠號，只要在後方加上--server.port 參數：

1

streamlit run <py程式檔案路徑> --server.port 8888

需要終止該應用程式只需在終端中按 Ctrl + c。

創建 Streamlit 應用程式

除了跟著我以下的文章流程學習，也可以參考官方文檔 Get started 的流程操作。

新增 py 程式碼

新創建一個 Python 檔案 streamlit_app.py，以下教學都只會編輯這個檔案。

打開它，在一開始導入 Streamlit 與範例需要的其他套件：

1
2
3
4
5
6


import time
import streamlit as st
import numpy as np
import pandas as pd

打開 "命令提示字元" 或 "終端機"，開始執行程式：

1

streamlit run streamlit_app.py

* 第一次執行時，它可能會問你 Email，這可以不用理它，直接按 Enter 即可。

執行 Streamlit 程式，第一次會遇到 Email

它應該會顯示如下資訊，並自動開啟一個瀏覽器網頁。

執行 Streamlit 程式

然後網頁裡面顯示… 一片空白？！
沒錯！我們又還沒有添加元件進去，怎麼會有東西呢~ 😆

添加文字和數據

先幫我們的應用程式上個標題，加入以下程式碼：

1

st.title('我的第一個應用程式')

存檔，回到瀏覽器的網頁上。

可以重整網頁，或點擊右上角菜單內 "Rerun" 的按鈕，

Rerun 重整網頁

網頁上就會顯示一個標題文字了：

試著加入標題吧

如何？簡單吧，那我們再繼續接著下去~

使用 `st.write` 和 Magic Commands

在 Streamlit 內有個神奇的指令，他們把它叫 st.write 和 Magic Commands ，不管給它 "字串"、"Markdown"、"數據資料" 還是 "圖表"，Streamlit 都會自動辨別並以合適的方式顯示出來。

在程式碼中只要把想顯示的東西放進 st.write，甚至單一行只有變數或字串，根本不需要使用 st.write，它都會自動套用並顯示。

1
2
3
4
5
6
7


st.write("嘗試創建**表格**：")
df = pd.DataFrame({
'first column': [1, 2, 3, 4],
'second column': [10, 20, 30, 40]
})
df

呈現 Markdown 與表格

但是官方有提到有以下三個原因，如果可以的話還是使用更具體的方法比較好：

Magic 和 st.write() 會檢查您傳入的數據類型，然後決定如何最好地呈現，但有時你可能想以另一種方式呈現它。
其他方法返回一個可以使用和修改的對象，可以通過向其添加數據或替換它。
如果使用更具體的 Streamlit 方法，您可以傳遞其他參數來自定義其行為。

繪製圖表和地圖 Chart

折線圖 `st.line_chart()`

使用 Numpy 生成一個隨機樣本，然後將其繪製成折線圖。

1
2
3
4


chart_data = pd.DataFrame(
np.random.randn(20, 3),
columns=['a', 'b', 'c'])
st.line_chart(chart_data)

而且它本身有下載、全螢幕觀看等功能。

繪製折線圖

地圖 `st.map()`

使用 Numpy 生成一個隨機樣本，繪製到地圖上。

1
2
3
4


map_data = pd.DataFrame(
np.random.randn(100, 2) / [50, 50] + [22.6, 120.4],
columns=['lat', 'lon'])
st.map(map_data)

繪製地圖

更多圖表元件請參考：官方文件 Chart elements

輸入類元件

除了上述標題、圖表，還有其他小工具，像是按鈕、選擇框、複選框、滑塊等等。

按鈕 `st.button()`

1
2


if st.button('不要按!'):
st.text("不是叫你不要按了嗎！")

按鈕元件

但你可能會注意到，每次點擊按鈕時，上方的折線圖也會產生變化。
這是因為 Streamlit 只要元件有輸入值的改變，整個程式(網頁)就會重新運行，因此折線圖裡的 random 才會出來不同資料。

複選框 `st.checkbox()`

使用複選框來顯示/隱藏數據，例如將剛剛繪製地圖的程式改成：

1
2
3
4
5


if st.checkbox('顯示地圖圖表'):
map_data = pd.DataFrame(
np.random.randn(100, 2) / [50, 50] + [22.6, 120.4],
columns=['lat', 'lon'])
st.map(map_data)

選擇框 `st.selectbox()`

使用選擇框提供使用者選擇：

1
2
3
4


option = st.selectbox(
'你喜歡哪種動物？',
['狗', '貓', '鸚鵡', '天竺鼠'])
st.text(f'你的答案：{option}')

複選框與選擇框

調整佈局 Layout

除了剛剛示範的一行一個元件，Streamlit 有提供幾種佈局容器元件供使用、排版。

側邊欄 `st.sidebar`

例如我們能將元件移到側邊欄中，這邊範例將剛剛的選擇框移入側邊欄：

1
2
3
4


option = st.sidebar.selectbox(
'你喜歡哪種動物？',
['狗', '貓', '鸚鵡', '天竺鼠'])
st.sidebar.text(f'你的答案：{option}')

將元件移到側邊欄

列容器 `st.columns()`

也有左右兩邊的方式來排列的容器：

1
2
3


left_column, right_column = st.columns(2)
left_column.write("這是左邊欄位。")
right_column.write("這是右邊欄位。")

展開容器 `st.expander()`

也可以通過能展開的容器，來隱藏大量內容來節省空間：

1
2


expander = st.expander("點擊來展開...")
expander.write("如果你要顯示很多文字，但又不想佔大半空間，可以使用這種方式。")

將內容摺疊起來，節省空間

分頁容器 `st.tabs()`

或者切出不同分頁，來放置不同種類的資料：

1
2
3
4
5
6
7
8
9


tab1, tab2 = st.tabs(["Cat 介紹", "Dog 介紹"])
with tab1:
st.header("A cat")
st.image("https://static.streamlit.io/examples/cat.jpg", width=200)
with tab2:
st.header("A dog")
st.image("https://static.streamlit.io/examples/dog.jpg", width=200)

不同分頁，放置不同種類的資料

其他更多佈局和容器請參考：官方文件 Layouts and Containers

狀態元件 Status

進度條 `st.progress()`

使用 time.sleep() 來模擬進度條的等待：

1
2
3
4
5
6


bar = st.progress(0)
for i in range(100):
bar.progress(i + 1, f'目前進度 {i+1} %')
time.sleep(0.05)
bar.progress(100, '載入完成！')

而且網頁右上角還會顯示"RUNNING…"，並有多個運動圖示跳動，讓使用者知道目前網頁中還有東西正在運行。

進度條載入時，網頁右上角 RUNNING... 字樣

消息通知 `st.toast()`

當有時候我們會需要跳出一個消息通知使用者，但並不想太干擾使用者，這時候就可以使用 st.toast()：

* 也可以為文字加上顏色，和加上 icon。

1
2
3
4


if st.button('儲存', type="primary"):
st.toast(':rainbow[你編輯的內容已經保存]', icon='💾')
# 或是簡單點，只顯示文字
# st.toast('你編輯的內容已經保存')

box 訊息 `st.success()`、`st.info()`、`st.warning()`、`st.error()`

或者想要在頁面上顯示較醒目的錯誤訊息：

1
2
3
4


st.success('Success!')
st.info('Info!')
st.warning('Warning!')
st.error('Error!', icon='🚨')

box 訊息和右下角的 toast 消息

特效 `st.balloons()` 與 `st.snow()`

還有看似無用，但真的好像無用(?)的特效，慶祝氣球 st.balloons() 與慶祝降雪 st.snow()：

慶祝氣球特效

聊天元件 Chat

聊天元件 `st.chat_message()` 與 `st.chat_input()`

最近因為 ChatGPT 之類的 LLM 熱門而新增的 "聊天元件" st.chat_message()、st.chat_input()：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


with st.chat_message("user"): # 或者寫 "human"
st.write("Hi 👋，請問你是誰？")
# 另一種寫法
message = st.chat_message("assistant") # 或者寫 "ai"
# message = st.chat_message("assistant", avatar="🦖") # 自訂頭像
message.write("你好！我是 ChatBot 🤖，可以回答各種問題，提供資訊。")
message.write("有什麼我可以幫助你的嗎？")
st.chat_input("Say something...")

因應最近 LLM 熱門而新增的聊天元件

官方還特別寫兩篇教你如何搭建一個對話式的應用程式，甚至示範如何串接 OpenAI 的 GPT 模型，或透過 LangChain 串接：

表單元件

表單 `st.form()`

經過上面的嘗試，我們都發現在 Streamlit 中，操作每個元件都會導致整個應用程式重新運行。

但是，有時我們可能希望像表單那樣，全部填寫好後再一次觸發(提交)，這時候就可以使用 st.form() 表單元件：

1
2
3
4
5
6
7
8


with st.form(key='my_form'):
form_name = st.text_input(label='姓名', placeholder='請輸入姓名')
form_gender = st.selectbox('性別', ['男', '女', '其他'])
form_birthday = st.date_input("生日")
submit_button = st.form_submit_button(label='Submit')
if submit_button:
st.write(f'hello {form_name}, 性別:{form_gender}, 生日:{form_birthday}')

使用表單元件，一次一起提交

使用快取 Caching

如同前面所述，只要元件輸入值有改變，整個程式(網頁)就會重新運行，但假如有較耗費時間、資源的運算，會造成使用者每調一個參數，就浪費時間在等待，或者產生的物件被重置。

因此 Streamlit 內提供兩種快取(Caching)機制，將之前運算過的結果快取起來，如果下次遇到一樣的輸入值，就能直接使用之前的結果，節省時間，也有助於在重新運行時持久保存物件。

這兩種快取機制以裝飾器(Decorator)寫法使用，用途區分如下：

@st.cache_data：計算後的結果、從 CSV 加載 DataFrame、查詢 API…，大多情況都可以使用 @st.cache_data。
@st.cache_resource：全域資源，例如 ML 模型或資料庫連接。

Streamlit 提供兩種緩存(Caching)機制

對於會變動的資料來源，建議可以設定 ttl (time to live)，例如設定 ttl=300，則快取會在 3600 秒 (1小時) 後失效，並在重新運行函數時，再次執行、緩存快取。

對於資料量太大造成記憶體可能不足問題，則可以設定 max_entries=1000 來限制最大資料筆數。

* 更多說明請參考官方文件： Caching

要使用 @st.cache_data 裝飾器，就需要將運算部分的程式碼包成函式(def)。

1
2
3
4
5
6
7


@st.cache_data(ttl=3600, show_spinner="正在加載資料...") # 👈 Add the caching decorator
def load_data(url):
df = pd.read_csv(url)
return df
df = load_data("https://raw.githubusercontent.com/plotly/datasets/master/26k-consumer-complaints.csv")
st.dataframe(df)

第一次載入時會跑比較久(上面範例是讓它到網路上下載 csv 資料後顯示)，之後再重整網頁時，因為有快取的關係，它應該一瞬間就顯示出來了。

如果想要清除快取再測試，可以從右上角的選單選擇 "Clear caches"：

右上角選單 "Clear caches" 可以清除快取

網頁配置設定

網頁配置程式碼要寫在所有 Streamlit 命令之前，而且只能設定一次。

此函式有五個參數：

page_title：網頁標題，顯示在瀏覽器分頁的標籤上，預設是程式碼的檔名。
page_icon：網頁圖標，顯示在網頁標題前，可以使用 st.image 或 Emoji，或者使用"random"讓它隨機產生XD。
layout：網頁中佈局寬度，預設是"centered"，還可以使用"wide"。
initial_sidebar_state：側邊欄顯示狀態，"expanded"打開或"collapsed"隱藏，預設是"auto"，代表在手機尺寸的設備上是隱藏，否則是打開顯示。
menu_items：右上角的菜單設定，共有以下三項可以設定：
- “Get help”：設定 URL，如果沒有，則會隱藏此菜單選項。
- “Report a Bug”：設定 URL，如果沒有，則會隱藏此菜單選項。
- “About”：顯示在 "關於" 彈跳視窗中的 Markdown 字串，如果沒有，則僅顯示 Streamlit 預設的內容。
- URL 也可以設定為電子郵件地址，像是 mailto:john@example.com。

官方文件： st.set_page_config

自訂網頁標題與 icon

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


st.set_page_config(
page_title="自定義網頁標題",
page_icon="random",
layout="centered",
initial_sidebar_state="expanded",
menu_items={
'Get Help': 'https://blog.jiatool.com/about/',
'About': "# 這是什麼網頁？ \n**[IT空間](https://blog.jiatool.com/)** 示範 streamlit 之用網頁"
}
)

在網頁右上方選單，除了之前提過的 Rerun 和清除快取，還有網頁設定與螢幕錄影功能，將你的操作流程直接錄影起來，展示給其他人。

而選單內的"設定"有幾個選項：

Run on save：程式存檔後網頁自動重跑，不需要再手動點 Rerun
Wide mode：佈局寬度調寬
Theme：選擇或自訂佈景主題

* 自定義主題可參考官方介紹說明。

右上角選單 "Settings" 網頁設定

部署應用程式

除了將程式在自己的電腦執行，或架在伺服器之外，官方有提供「 Streamlit Community Cloud 」，可以在上面部署、管理、共享你的 Streamlit 應用程式。你只要將專案上傳自己的 GitHub 存儲庫(公開或私有都可以)，再到 Streamlit Community Cloud 設定連接即可，算是蠻方便的。

* 關於 Streamlit Community Cloud 官方說明可在這邊查看： Welcome to Streamlit Community Cloud

完整部署介紹請參考官方說明，只需要四個步驟：

先確認你的資料夾內有程式執行需要的依賴套件文件：
- Python 依賴文件 [必要]：requirements.txt、Pipfile、environment.yml、pyproject.toml 這幾種擇一，指定程式需要哪些 Python 套件。
- apt-get 依賴 [非必要]：需要哪些 apt-get 的依賴套件。
將專案推到自己的 GitHub (公開或私有都可以)。
前往 share.streamlit.io 工作區，連接你剛剛上傳的 GitHub 存儲庫。
部署完成！！

推上 GitHub 的專案資料夾內大致會長這樣：

your-repository/
├── streamlit_app.py
└── requirements.txt

推上 GitHub Repository

前往 share.streamlit.io 工作區，連接你剛剛上傳的 GitHub 存儲庫。

點擊右上角 "New app"

右上角 "New app"

第一次需要給 Streamlit 擁有讀取 GitHub Repository 的權限：

第一次需要給 Streamlit 讀取 GitHub 權限

下一步，指定 GitHub Repository、分支、程式檔案名稱，以及是否要自訂網址名稱(你可以為你的應用程式自訂一個獨一無二的名稱)：

部署設定

下方還可以打開 "Advanced settings…"，這邊可以更改 Python 版本、設定環境變數。
我們這個範例不需要編輯這邊。

部署進階設定

點擊 "Deploy!"，等個一、兩分鐘安裝。

部署中...

部署完成，網址列上顯示的就是你這個應用程式的專屬網址，把它分享給其他人炫耀你努力的成果吧~🎉

部署完成

前往 share.streamlit.io 工作區，可以查看你全部的 Streamlit 應用程式，它還提供統計來訪人數的功能。

share.streamlit.io 工作區

來看看我 2021 年發布的 Demo 範例，共有 1,522 名讀者來訪~ (而且是計算不重複的)
* 這個統計功能是從 2022 年 4 月才開始，所以實際上會再更多。

統計來訪人數

完整範例程式碼

附上完整範例程式碼： streamlit_app.py

此範例程式碼部署在 Streamlit Cloud (share.streamlit.io) 的 Demo：

Streamlit 成果範例：streamlit_2023_demo

結語

從之前第一次嘗試 Streamlit 到現在過了兩年多，它又陸續新增了不少功能，看起來還有積極再發展。

經過上方教學實際操作後，會發覺這個套件真的可以很簡單、快速的建立一個顯示資料用的儀表板(Dashboard)，因此特別寫這篇文章來分享給大家~

參考：
Streamlit 官方網站
 Streamlit 官方文檔

每一個你討厭的現在，
都有一個不夠努力的曾經。

—— 幾米 (台灣繪本作家)

Playwright 瀏覽器自動化工具，應用於網路爬蟲和測試

jia@jiatool.com (Jia) — Sat, 20 Nov 2021 21:00:00 +0800

前言

你還在使用 Selenium 來網路爬蟲或自動化測試嗎？或許你可以來試試另一個工具 — Playwright。

(圖片來源：Unsplash)

[小廣告] 我製作了一款可愛的「企鵝魔法師」貼圖~
歡迎下載：LINE 貼圖、Telegram 貼圖 (免費)

Playwright 套件簡介

Playwright 是微軟 Microsoft 開發的一個開源瀏覽器自動化工具，可以選擇 Chromium、Firefox、WebKit 瀏覽器，目前有 Python、JavaScript、TypeScript、.NET、Java 的 API 可供使用。

* 本篇文章以 Python 為範例，但各程式語言的 API 應該是差不多的。

	Linux	macOS	Windows
Chromium 98.0.4708.0	✅	✅	✅
WebKit 15.4	✅	✅	✅
Firefox 94.0.1	✅	✅	✅

* 此版本會持續更新，以官方文檔為主。

Playwright 第一次輸入指令就會自動下載瀏覽器，與自己使用的瀏覽器是分開的。不用像 Selenium 要手動下載，版本更新還要去更新驅動。

Playwright 在對元素(elements)操作之前，會自動等待元素準備完成(可見的、啟用的…)，不用怕元素還沒載入就執行造成錯誤，也不需要自己加等待。

就像省去了 Selenium 內的 WebDriverWait：

1
2
3


WebDriverWait(self.driver, timeout).until(
EC.presence_of_element_located((By.CSS_SELECTOR, '#search'))
)

* 詳細可以參考官方文檔：https://playwright.dev/python/docs/actionability

* Playwright 支援同步和異步(搭配 asyncio)，本篇文章皆使用同步來示範。
* Playwright 甚至能自動產生程式碼，這部分可以參考大數學堂的影片教學： [爬蟲實戰] 如何不寫任何一行程式碼透過低代碼Low-Code / No-Code 工具 Playwright撰寫網頁自動化瀏覽程式

教學

先來試試官方文檔內的基本程式：

1
2
3
4
5
6
7
8


from playwright.sync_api import sync_playwright
with sync_playwright() as p:
browser = p.chromium.launch()
page = browser.new_page()
page.goto("http://playwright.dev")
print(page.title())
browser.close()

首先創造一個瀏覽器實例，開新分頁，再來前往 http://playwright.dev 網頁，並取得網頁的 title，最後關閉瀏覽器。

它預設是以「無頭模式」啟動，但為了在寫程式時觀察它運作，我們可以先將其關閉：

1

browser = p.chromium.launch(headless=False)

常見的基本操作

以下是幾種常見的網頁基本操作：

1
2
3
4
5
6
7
8


# 點擊
page.click('div')
# 輸入文字
page.fill('#search', 'query')
# 複選框和單選按鈕
page.check('#agree')
# 下拉選擇欄
page.select_option('select#colors', 'blue')

更多進階用法與參數可參考官方文檔：

滑鼠 Mouse：https://playwright.dev/python/docs/api/class-mouse
鍵盤 Keyboard：https://playwright.dev/python/docs/api/class-keyboard

元素定位

基本操作或取得元素皆使用 CSS Selector 元素定位。

關於 CSS Selector (選擇器)的寫法可以參考我以前整理的文章：
常用網頁 CSS Selector (選擇器)取得元素，搭配 Python BeautifulSoup 套件

Playwright 除了有一般的 Selector 用法以外，還有個比較特別且好用的 "文字(text)" 選擇方式：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17


# 取得包含此段文字的元素 (不分大小寫)
page.click('text=Log in')
# 取得與此段文字一模一樣的元素 (注意裡面還有引號)
page.click('text="Log in"')
# 如果要與 CSS Selector 結合，要使用以下方式
# 概念同等於上方的 'text=Log in'，包含此段文字 (不分大小寫)
page.click('button:text("Log in")')
# 概念同等於上方的 'text="Log in"'，文字要完全一樣
page.click('button:text-is("Log in")')
# 使用正則表達式
page.click('button:text-matches("[+-]?\\d+")')
# 還有一種是匹配內部包含文字的任何元素，可能在子元素或後代元素中
# 例如底下會匹配 <article><div>Playwright</div></article>。
element = page.wait_for_selector('article:has-text("Playwright")')

在文字匹配會對空格進行正規化，例如將多個空格轉換為一個，將換行符變成空格並忽略開頭和結尾的空格。

因為這部分有多種狀況、較複雜，我只是初步嘗試，如有錯誤歡迎底下留言告知。
參考：https://playwright.dev/python/docs/selectors/#text-selector

以及一些其他的選擇方式：

1
2
3
4


# 返回 <article> 具有 <div class=promo> 內部元素的文本內容
page.text_content("article:has(div.promo)")
# 僅點擊可見 class=button 的元素
page.click(".button:visible")

選取元素

如果要取得元素，可以使用：

1
2
3
4


# 取得元素
page.query_selector('#promo')
# 取得元素，加入等待
page.wait_for_selector('#promo')

獲取元素的文字及屬性：

1
2
3
4


# 取得元素的文字
page.query_selector('h3').text_content()
# 取得元素的屬性(attribute)
page.query_selector('section').get_attribute('class')

瀏覽器參數

在教學一開始說到無頭模式，在 launch 加入 headless=False，它還有其他參數可以設定。
詳見：https://playwright.dev/python/docs/api/class-browsertype#browser-type-launch

像是傳遞給瀏覽器實例的附加參數，想讓它靜音就使用：

1
2
3


browser = playwright.chromium.launch(
args=["--mute-audio"] # 靜音
)

更多 Chromium flags 的列表：https://peter.sh/experiments/chromium-command-line-switches/

Cookies 和 Local Storage

儲存與載入 Cookies 和 Local Storage，可以用作保存登入狀態。

1
2
3
4
5


# 將存儲狀態保存到文件中
storage = context.storage_state(path="state.json")
# 使用保存的存儲狀態創建新上下文(context)
context = browser.new_context(storage_state="state.json")

結語

它還有個 GUI 工具 Trace Viewer，可以在程式執行後幫助探索操作過程，感覺非常的厲害，但這部分我就還沒嘗試過，有興趣可以參考：https://playwright.dev/python/docs/trace-viewer

Playwright 相比 Selenium 來說是比較新出來的工具(不過都已經是正式版了)，許多功能更好用，如果你原先是使用 Selenium 來寫網路爬蟲或做自動化測試，或許可以試試 Playwright，搞不好你就會愛上囉。😆

歡迎追蹤『 IT空間』FB 粉專，取得最新發文通知🔔

參考：
Playwright 官方網站
 Playwright 文檔
 Playwright API
Playwright for Python GitHub

對於自己想做的事，就放手去挑戰吧！不是因為覺得能成功就去做，而是發自內心的想要嘗試看看，這樣不管結果如何，自己都不會後悔。

—— 鈴木一朗 (棒球選手)

FinMind API 取得"台股、匯率、黃金"等金融相關資料

jia@jiatool.com (Jia) — Sun, 17 Oct 2021 20:40:00 +0800

前言

許多人接觸到 Python，開始學習" 網路爬蟲 "、"資料分析"、"機器學習"，有一部分的人是因為「股票」。但要自己爬取資料確實有點麻煩，而且不同網站可能還有反爬蟲的機制，這對於想要資料來做資料分析、預測股價的人來說，可能就是一個卡在前面的阻礙。

之前我發現一個 FinMind API，主要以台股為主，提供很多項的金融開源數據，方便讓我們來使用。

本篇文章會挑幾項功能來說明，以及 Python 範例程式碼。

(圖片來源：Unsplash)

FinMind 套件簡介

FinMind 提供以台股為主，超過 50 種金融相關數據資料，除了 API 可以取得資料、回測、繪製 k 線圖、儀表板，也提供網頁版的操作介面、策略分析與資料集下載功能。

因為是透過 API 串接，不限制程式，你想要使用 Python、JavaScript、PHP、C++、Java、Ruby……都可，或直接透過它的官網下載資料，對於想要做大數據、資料分析、預測股價的人來說，應該算是一個很方便的工具。

從官方 API 文檔可以看到大概有以下資料：

技術面 : 台股股價 daily、歷史 tick 逐筆交易、PER、PBR、每5秒委託成交統計、台股加權指數。
基本面 : 綜合損益表、現金流量表、資產負債表、股利政策表、除權除息結果表、月營收。
籌碼面 : 外資持股、股權分散表、融資融券、三大法人買賣、借券成交明細。
消息面 : 台股相關新聞。
衍生性商品 : 期貨、選擇權 daily data、交易明細、期貨三大法人買賣，期貨各卷商每日交易、選擇權各卷商每日交易。
國際市場 : 美股股價 daily、minute、美國債券殖利率、貨幣發行量(美國)、黃金價格、原油價格、G8 央行利率、G8 匯率、

ℹ 但比較可惜的一點是目前「不提供即時資料」，看文檔的說明是說由於資料源問題，移除即時報價：https://finmind.github.io/WhatIsNew/

教學

FinMind API 文檔內都有簡單的程式碼範例，這邊我就挑其中的五種來示範說明。

程式一開始，先將需要的套件匯入，pandas 不一定要有(這裡只是拿來方便看資料)：

1
2


import requests
import pandas as pd

股價日成交資訊

這項資料就是臺灣證交所的個股日成交資訊

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


url = "https://api.finmindtrade.com/api/v4/data"
parameter = {
"dataset": "TaiwanStockPrice",
"data_id": "2330",
"start_date": "2021-09-13",
"end_date": "2021-09-17"
}
r = requests.get(url, params=parameter)
data = r.json()
stock_deal_info = data["data"]
print(pd.DataFrame(stock_deal_info))

輸出結果如下：

股價日成交資訊輸出結果

欄位依序代表：“日期”、“股票代碼”、“成交股數”、“成交金額”、“開盤價”、“最高價”、“最低價”、“收盤價”、“漲跌價差”、“成交筆數”

股票當日逐筆成交資訊

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


url = "https://api.finmindtrade.com/api/v4/data"
parameter = {
"dataset": "TaiwanStockPriceTick",
"data_id": "2330",
"start_date": "2021-09-27"
}
r = requests.get(url, params=parameter)
data = r.json()
stock_history_info = data["data"]
print(pd.DataFrame(stock_history_info).tail()) # 顯示最後五筆資料

輸出結果如下：

股票當日逐筆成交資訊輸出結果

欄位依序代表：“日期”、“股票代碼”、“成交金額”、“成交量”、“時間”、“漲跌(1:漲；2跌)”

股票綜合損益表

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


url = "https://api.finmindtrade.com/api/v4/data"
parameter = {
"dataset": "TaiwanStockFinancialStatements",
"data_id": "2330",
"start_date": "2021-06-01",
"end_date": "2021-09-01" # 不加則抓到現在日期
}
r = requests.get(url, params=parameter)
data = r.json()
stock_income_statement = data["data"]
print(pd.DataFrame(stock_income_statement))

輸出結果如下：

股票綜合損益表輸出結果

股利政策表

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


url = "https://api.finmindtrade.com/api/v4/data"
parameter = {
"dataset": "TaiwanStockDividend",
"data_id": "2330",
"start_date": "2021-01-01"
}
r = requests.get(url, params=parameter)
data = r.json()
stock_dividend = data["data"]
print(pd.DataFrame(stock_dividend).head()) # 顯示前五筆資料

輸出結果如下：

股利政策表輸出結果

外幣對台幣匯率

共有 19 種幣別與新臺幣(TWD)的匯率，資料來源為台灣銀行，應該就是此網頁。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


url = "https://api.finmindtrade.com/api/v4/data"
parameter = {
"dataset": "TaiwanExchangeRate",
"data_id": "USD",
"start_date": "2021-01-01"
}
r = requests.get(url, params=parameter)
data = r.json()
exchange_rate = data["data"]
print(pd.DataFrame(exchange_rate).tail()) # 顯示最後五筆資料

輸出結果如下：

外幣對台幣匯率輸出結果

欄位依序代表：“日期”、“貨幣”、“現金匯率>銀行買入”、“現金匯率>銀行賣出”、“即期匯率>銀行買入”、“即期匯率>銀行賣出”

範例程式碼

我將以上功能包裝成 class 的完整範例程式碼，附上給需要的人參考。

GitHub Gist： stock_finmind.py

流量限制 & 會員機制

FinMind API 有流量限制，每小時最多 300 次請求，如果註冊成為會員(免費)，則提升至 600 次 / 小時。

另外還有兩種付款的會員，除了差在每小時的請求限制外，某些功能只有付費會員能使用，例如一次拿特定日期中全部股票的資料。

更多詳細會員機制的 "贊助方案" 參考官網說明：https://finmindtrade.com/analysis/#/Sponsor/sponsor。

結語

以上是直接對 API 請求，如果你是使用 Python，還有官方包裝好的套件( GitHub )，還幫你寫好幾項量化工具 (回測、K 線、客製化看盤儀表板) 可方便使用。

更多其他資料或範例，參考 FinMind API 官方文檔。

除了本篇介紹的 FinMind，還有其他許多股票相關的套件可以嘗試：

twstock https://github.com/mlouielu/twstock
yahooquery https://github.com/dpguthrie/yahooquery
pandas-datareader https://github.com/pydata/pandas-datareader

歡迎追蹤『 IT空間』FB 粉專，取得最新發文通知🔔

參考：
FinMind 官方網站
 FinMind API 文檔
 FinMind GitHub

People at work, money at work.
人可以工作，錢也可以幹活。

Streamlit 超快速又輕鬆建立網頁 Dashboard

jia@jiatool.com (Jia) — Sun, 23 May 2021 20:50:00 +0800

前言

後來時隔兩年，我有整理更新的版本，請改去這邊：
(2023年新版) 使用 Streamlit 快速又輕鬆建立 Dashboard 網頁

Streamlit 是個可快速製作出 Web 網頁應用程式的套件，而且不需要任何前端技術，全部都採用 Python 語法，讓你將網路爬蟲、數據科學、機器學習資料簡單地呈現出來分享，是一個很方便的套件。

Demo

這是最後將程式碼放到 GitHub，並使用 Streamlit 部署的成果。

Streamlit 成果範例：streamlit_demo

安裝與執行

Streamlit [ 官方網站 ] [ 官方文檔 ]

安裝

1

pip install streamlit

執行

1

streamlit run <py程式檔案路徑>

如果想指定 Streamlit 的 port 埠號，只要在後方加上--server.port 參數：

1

streamlit run <py程式檔案路徑> --server.port 8888

需要終止該應用程式只需在終端中按 Ctrl + c。

範例教學

底下流程是參考官方文檔的流程操作。

創建一個 Streamlit 應用程式

新創建一個 Python 檔案 streamlit_app.py，以下教學都只會編輯這個檔案。

打開它，在一開始導入 Streamlit 與其他套件：

1
2
3
4
5
6


import time
import streamlit as st
import numpy as np
import pandas as pd

打開"命令提示字元"或"終端機"，開始執行程式：

1

streamlit run streamlit_app.py

它應該會顯示如下資訊，並自動開啟一個瀏覽器網頁。

執行 Streamlit 程式

然後網頁裡面顯示… 一片空白？！
沒錯！我們又還沒有添加元件進去，怎麼會有東西呢~ 😆

添加文字和數據

先幫我們的應用程式加上個標題，加入以下程式碼：

1

st.title('我的第一個應用程式')

存檔，回到瀏覽器的網頁上。
可以重整網頁，或點擊右上角"Rerun"的按鈕，

網頁重跑

網頁上就會顯示一個標題文字了：

加入標題

如何？簡單吧，那我們再繼續接著下去~

使用 Magic Commands

在 Streamlit 內有個神奇的指令，他們把它叫 Magic commands ，不管你給它"字串"、"Markdown"、"數據資料"、"Matplotlib figures"、"Altair charts"，Streamlit 都會辨別並以合適的方式顯示出來。

甚至在程式碼中單一行只有變數或字串，根本不需要使用 st.write()，它都會自動套用並顯示。

1
2
3
4
5
6
7


st.write("嘗試創建**表格**：")
df = pd.DataFrame({
'first column': [1, 2, 3, 4],
'second column': [10, 20, 30, 40]
})
df

Markdown 與表格

繪製圖表和地圖

繪製折線圖
使用 Numpy 生成一個隨機樣本，然後將其繪製成圖表。

1
2
3
4


chart_data = pd.DataFrame(
np.random.randn(20, 3),
columns=['a', 'b', 'c'])
st.line_chart(chart_data)

而且它本身有下載、全螢幕觀看等功能。

繪製折線圖

繪製地圖
使用 Numpy 生成一個隨機樣本，繪製到地圖上。

1
2
3
4


map_data = pd.DataFrame(
np.random.randn(100, 2) / [50, 50] + [22.7, 120.3],
columns=['lat', 'lon'])
st.map(map_data)

繪製地圖

加入小工具

除了上述標題、圖表，還有其他小工具，像是複選框、選擇框、按鈕、滑塊等等。

使用複選框來顯示/隱藏數據，例如在剛剛繪製地圖的程式上方加入：

1
2
3
4
5


if st.checkbox('顯示地圖圖表'):
map_data = pd.DataFrame(
np.random.randn(100, 2) / [50, 50] + [22.7, 120.3],
columns=['lat', 'lon'])
st.map(map_data)

但你可能會注意到，每次點擊複選框時，上方的折線圖也會產生變化。
這是因為 Streamlit 只要元件有輸入值的改變，整個程式(網頁)就會重新運行，因此折線圖裡的 random 才會出來不同資料。

使用選擇框進行選擇：

1
2
3
4


option = st.selectbox(
'你喜歡哪種動物？',
['狗', '貓', '鸚鵡', '天竺鼠'])
'你的答案：', option

複選框與選擇框

調整佈局

我們也能將元件移到側邊欄中，這邊範例將上方選擇框移入側邊欄：

1
2
3
4


option = st.sidebar.selectbox(
'你喜歡哪種動物？',
['狗', '貓', '鸚鵡', '天竺鼠'])
'你的答案：', option

將元件移到側邊欄

也有左右兩邊的方式來排列：

1
2
3


left_column, right_column = st.beta_columns(2)
left_column.write("這是左邊欄位。")
right_column.write("這是右邊欄位。")

或通過 st.beta_expander 來隱藏大量內容來節省空間。

1
2


expander = st.beta_expander("點擊來展開...")
expander.write("如果你要顯示很多文字，但又不想佔大半空間，可以使用這種方式。")

將內容摺疊起來

加入進度條

這邊使用 time.sleep() 來模擬進度：

1
2
3
4
5
6
7


# 增加一個空白元件，等等要放文字
latest_iteration = st.empty()
bar = st.progress(0)
for i in range(100):
latest_iteration.text(f'目前進度 {i+1} %')
bar.progress(i + 1)
time.sleep(0.1)

而且網頁右上角還會顯示"RUNNING…"，並有多個運動圖示跳動，讓使用者知道目前網頁中還有東西正在運行。

網頁 RUNNING... 字樣

使用快取

如同前面所述，只要元件輸入值有改變，整個程式(網頁)就會重新運行，但假如有較耗費時間、資源的運算，會造成使用者每調一個參數，就浪費時間在等。

因此 Streamlit 內提供一個緩存機制，可以使用 @st.cache 裝飾器，將之前運算過的結果快取起來，如果下次遇到一樣的輸入值，就能直接使用之前的結果，節省時間。

官方說明 Improve app performance

要使用 @st.cache 裝飾器，就需要將運算部分的程式碼包成函式(def)。

1
2
3
4
5
6
7
8
9


@st.cache(suppress_st_warning=True)
def expensive_computation(a):
st.write(f"沒有快取：expensive_computation({a})")
time.sleep(2)
return a * 2
a = st.slider("選擇一個數字", 0, 10)
result = expensive_computation(a)
st.write("結果：", result)

cache 快取

網頁配置設定

要寫在程式內所有 Streamlit 命令之前，而且只能設定一次。

此函式有四個參數：

page_title：網頁標題，顯示在瀏覽器分頁的標籤上，預設是程式碼的檔名。
page_icon：網頁圖標，顯示在網頁標題前，可以使用 st.image 或 Emoji，或者使用"random"讓它隨機產生XD。
layout：網頁中佈局寬度，預設是"centered"，還可以使用"wide"。
initial_sidebar_state：側邊欄顯示狀態，"expanded"打開或"collapsed"隱藏，預設是"auto"，代表在手機尺寸的設備上是隱藏，否則是打開顯示。

網頁標題與 icon

1
2
3
4
5
6


st.set_page_config(
page_title="自定義網頁標題",
page_icon="random",
layout="centered",
initial_sidebar_state="collapsed",
)

網頁選單設定

在網頁右上方有個選單，包含之前提過的 Rerun，以及清除快取、連結到官方文件論壇，甚至還有螢幕錄影功能，將你的操作流程直接錄影起來，展示給其他人。

網頁選單

而選單內的"設定"有幾個選項：

Run on save：程式存檔後網頁自動重跑，不需要再手動點 Rerun
Wide mode：佈局寬度調寬
Theme：佈景主題

* 自定義主題可參考官方介紹說明。

網頁設定

部署應用程式

官方提供一種方式部署，只需要將你的 Streamlit 應用程式放在 GitHub 上，即可登入 share.streamlit.io 去部署運行起來。

完整部署介紹請參考官方說明：

先確認你的資料夾內有 Python 依賴文件，例如 requirements.txt、Pipfile、pyproject.toml、environment.yml 這幾種，或者還有 apt-get 依賴。
將你的 Streamlit 應用程式推到自己的 GitHub 公開 Repository。
前往官網註冊登入，並到 Get an invite to Streamlit sharing 設定。
打開網址、查看結果~

註冊 Streamlit sharing 後要等到邀請的 Email 回信，我的經驗是等了一天。

應用程式網址格式

你的網址格式為：
https://share.streamlit.io/[user name]/[repo name]/[branch name]/[app path]
例如我上面的範例是：
https://share.streamlit.io/it-jia/streamlit_demo/master/streamlit_app.py

而如果你 Git 分支是 master，或應用程式檔案名稱為 streamlit_app.py，甚至可以簡化成：
https://share.streamlit.io/[user name]/[repo name]
我的範例簡化成：
https://share.streamlit.io/it-jia/streamlit_demo

完整範例程式碼

附上完整範例程式碼： streamlit_app.py

此範例程式碼部署在 share.streamlit.io 的 Demo：

Streamlit 成果範例：streamlit_demo

結語

實際安裝使用後，發現這個套件真的可以很容易、快速的建立一個顯示資料用的儀表板(Dashboard)，因此寫這篇文章來分享給大家~

官方有將 API 濃縮成一頁，方便快速尋找：
https://share.streamlit.io/daniellewisdl/streamlit-cheat-sheet/app.py

參考：
Streamlit 官方網站
 Streamlit 官方文檔
 Streamlit極簡易的Dashboard開發 - Neutron
Python 以 Streamlit 建立網頁資料分析應用程式教學與範例 - Office指南

選擇，比努力更重要。

Python 使用 Faker 套件來生成假資料

jia@jiatool.com (Jia) — Mon, 09 Nov 2020 21:00:00 +0800

前言

有時候可能因為某些原因需要生成一些假資料，例如做網頁時，先填入一些假資料方便排版。

在 Python 中就有一個 Faker 套件來產生假資料，包括人名、電話、地址、工作、公司、信用卡、IP……非常多樣。

安裝

安裝也很簡單，可以透過 pip 安裝：

1

pip install faker

這邊要注意的是從版本 v4.0.0 開始，Faker 只支援 Python 3.5 及更新版本，並不支援 Python 2。

以下以撰寫文章時最新的版本 v4.14.2 為範例。
Faker 官方GitHub
Faker 官方文件

簡易範例

使用 faker.Faker() 來創建並初始化產生器，調用方法來產生資料，例如以下名字、地址。

1
2
3
4
5
6
7
8
9


from faker import Faker
fake = Faker()
fake.name()
# Carla Parker
fake.address()
# 1882 Erika Glens\nRoblesbury, MO 28877

語言包

看到這裡，可能有人覺得都是生成英文數據，我想要繁體中文那怎麼辦🤔
別擔心，Faker 有內建語言包的機制，在一開始創建 Faker 時帶入語言參數即可。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22


fake = Faker('zh_TW')
for _ in range(5):
print(fake.name())
print(fake.address())
print('--------')
# 許哲瑋
# 45851 臺東市復興路11號之9
# --------
# 林雅慧
# 67491 台北縣學府巷468號之1
# --------
# 陳宇軒
# 20610 新竹民治巷862號之2
# --------
# 殷沖
# 80604 橫山中興路5段595號5樓
# --------
# 李信宏
# 51142 台北大同路172號之2
# --------

你如果想要多個語言混合，當然也行🤣

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


fake = Faker(['zh_TW', 'ja_JP', 'ko_KR'])
for _ in range(6):
print(fake.name())
# 佐々木 明美
# 高橋 直子
# 宋惠如
# 이영일
# 佐々木 桃子
# 김미영

一些常見的語言代碼如下：

繁體中文：zh_TW
簡體中文：zh_CN
美國英文：en_US
英國英文：en_GB
日文：ja_JP
韓文：ko_KR
完整的語言包列表，請參考官方文件： https://faker.readthedocs.io/en/master/locales.html

* 題外話：我發現它的繁體中文有些地方不是很好，感覺是從簡體直接轉過來的。

方法介紹

人名

與人名相關數據，例如：姓氏、名字、羅馬拼音等等。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26


print(fake.name())
# 袁家銘
print(fake.name_female()) # 女生人名
# 莫怡萱
print(fake.name_male()) # 男生人名
# 孫威廷
print(fake.romanized_name()) # 羅馬拼音
# Ping Long
print(fake.last_name())
# 楊
print(fake.last_name_female())
# 李
print(fake.last_name_male())
# 黃
print(fake.last_romanized_name())
# Lin
print(fake.first_name())
# 家豪
print(fake.first_name_female())
# 惠雯
print(fake.first_name_male())
# 冠霖
print(fake.first_romanized_name())
# Jing

個人資料

像是：語言、手機號碼、身分證、工作職稱。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


print(fake.language_name())
# Turkmen
print(fake.country_calling_code())
# +290 8
print(fake.phone_number())
# 0977-739186
print(fake.ssn())
# D169226625
print(fake.job())
# 工業設計
print(fake.simple_profile())
# {'username': 'sfang', 'name': '李雅文', 'sex': 'M', 'address': '42346 板橋縣民有路310號之3', 'mail': 'xiuyingxue@gmail.com', 'birthdate': datetime.date(1936, 2, 13)}

地址

與地址相關數據，例如：完整地址、城市、鄉鎮、路名……。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


print(fake.address())
# 30751 基隆市仁愛街93號6樓
print(fake.building_number())
# 4號
print(fake.city())
# 卑南縣
print(fake.city_name())
# 草屯
print(fake.city_name_suffix())
# 縣
print(fake.country())
# 俄羅斯
print(fake.country_code())
# LT
print(fake.postcode())
# 824
print(fake.secondary_address())
# 之2
print(fake.street_address())
# 自由街759號
print(fake.street_name())
# 信義
print(fake.street_name_suffix())
# 路

公司

與公司相關數據，例如：公司名稱、公司前綴、公司後綴等等。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


print(fake.bs())
# synergize enterprise relationships
print(fake.catch_phrase())
# Object-based zero administration secured line
print(fake.company())
# 台北眾大捷運股份有限公司
print(fake.company_prefix())
# 品誠
print(fake.company_suffix())
# 有限公司

句子

與句子、單詞相關數據。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


print(fake.sentence())
# 發生服務選擇人民游戲然后一下法律.
print(fake.sentences())
# ['發現密碼地區那個精華制作.', '擁有地方手機所有.', '業務決定地址經濟投資方式.']
print(fake.text(max_nb_chars=15))
# 基本主要研究根據一種當然各種.
print(fake.word())
# 關於
print(fake.words())
# ['一種', '電影', '大學']

日期時間

日期時間相關數據，譬如：日期、時間、星期……。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25


print(fake.am_pm())
# AM
print(fake.iso8601())
# 1988-07-01T02:40:03
print(fake.date())
# 1970-12-22
print(fake.date_object())
# datetime.date(2004, 3, 20)
print(fake.date_this_month(before_today=True, after_today=False))
# 2020-11-07
print(fake.day_of_month())
# 01
print(fake.day_of_week())
# Saturday
print(fake.month_name())
# April
print(fake.time())
# 02:46:38
print(fake.time_object())
# datetime.time(8, 43, 22)
print(fake.unix_time())
# 1429693221

檔案

包括檔案名稱、附檔名、路徑等等。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


fake = Faker()
print(fake.file_extension(category='image'))
# jpeg
print(fake.file_name())
# central.png
print(fake.file_path())
# /recently/pass.js
print(fake.unix_device())
# /dev/sdg

網路

與網路相關數據，例如：Email、HTTP方法、IP、網址、網域……。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38


print(fake.company_email())
# dmeng@zou.com
print(fake.domain_name())
# tang.com
print(fake.domain_word())
# gao
print(fake.email())
# slei@gmail.com
print(fake.free_email())
# mliu@hotmail.com
print(fake.free_email_domain())
# yahoo.com
print(fake.hostname())
# desktop-15.wan.com
print(fake.http_method())
# POST
print(fake.image_url())
# https://placeimg.com/431/555/any
print(fake.ipv4())
# 28.144.124.103
print(fake.ipv4_network_class())
# c
print(fake.ipv4_private())
# 192.168.96.99
print(fake.ipv4_public())
# 75.81.186.65
print(fake.mac_address())
# d2:3c:7b:3b:93:4f
print(fake.uri())
# http://fu.com/wp-content/categories/main/index/
print(fake.uri_extension())
# .php
print(fake.uri_page())
# search
print(fake.url())
# http://qiao.com/
print(fake.user_name())
# mingyan

顏色

生成顏色色碼，像是：HEX、RGB、HSV、HSL等等。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


print(fake.color())
# #6626ef
print(fake.color(hue='red'))
# #ed6595
print(fake.color(hue=(100, 200), color_format='rgb'))
# rgb(36, 181, 79)
print(fake.color(hue=135, luminosity='dark', color_format='hsv'))
# hsv(135, 95, 65)
print(fake.color_name())
# DarkMagenta
print(fake.hex_color())
# #dd5cbb
print(fake.rgb_color())
# 35,232,144

信用卡

信用卡相關資訊。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


print(fake.credit_card_full()) # 信用卡詳細信息
# JCB 16 digit
# 鈺婷 柳
# 3580134175667608 07/21
# CVC: 070
print(fake.credit_card_number()) # 卡號
# 377183544094989
print(fake.credit_card_expire()) # 有效日期
# 02/27
print(fake.credit_card_provider()) # 提供商名稱
# VISA 19 digit
print(fake.credit_card_security_code()) # 安全碼
# 320

Python 相關

與 Python 相關資料格式，可能對於測試很好用(?)，例如：Email、HTTP方法、IP、網址、網域……。
(竟然還有這種東西😮)

1
2
3
4
5
6
7
8


print(fake.pybool())
# False
print(fake.pydecimal())
# -7867266828.6
print(fake.pydict())
# {'都是': 'MyXkRCJjYanEWNNuYrLM', '一次': 'qiang69@gmail.com', '政府': Decimal('2879320.4'), '工作': 'fDURUWoCzsGhHdvjJHXM', '信息': 1080, '功能': 'hNvGqVhrMVwOYiYpYghC', '要求': Decimal('41.93441406219'), '一切': 'https://mao.tw/homepage/', '開始': 446798.631125}
print(fake.pylist())
# ['IartORkSBcHGqJCpfbMq', 'https://www.cui.com/terms.htm', datetime.datetime(1995, 12, 12, 4, 32, 50), 'vsJNgfvnxjDttefVvoIu', 'JxzLdZhLDYvgZHiHWjdO', 6960, 'mojun@hotmail.com', 'liangchao@yahoo.com', datetime.datetime(2013, 5, 9, 12, 38, 18), 'phao@hotmail.com', 'https://mo.com/privacy/', 6105]

其他更多

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28


print(fake.random_digit())
# 8
print(fake.random_digit_not_null())
# 3
print(fake.random_int(min=0, max=15))
# 12
print(fake.random_element(elements=('a', 'b', 'c', 'd')))
# d
print(fake.numerify(text='Intel Core i%-%%##K vs AMD Ryzen % %%##X'))
# Intel Core i8-9363K vs AMD Ryzen 4 6134X
print(fake.language_code()) # i18n 語言碼
# uk
print(fake.license_plate()) # 車牌
# 048-DQU
print(fake.isbn10()) # ISBN碼
# 1-57202-578-6
# user agent
print(fake.android_platform_token())
# Android 4.1.1
print(fake.ios_platform_token())
# iPhone; CPU iPhone OS 10_3_3 like Mac OS X
print(fake.chrome())
# Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/535.0 (KHTML, like Gecko) Chrome/38.0.819.0 Safari/535.0
print(fake.user_agent())
# Mozilla/5.0 (Windows 98; ug-CN; rv:1.9.1.20) Gecko/2016-01-13 09:28:45 Firefox/13.0

真的是太多了，這邊不一一列出，
更詳細參數介紹及其他方法請參閱 Faker 官方文件： Standard Providers

還有其他人提供並經過官方認可的，例如"汽車"、"Wi-Fi ESSID"、"Web相關"之類的類別： Community Providers

結語

有沒有覺得 Faker 套件所包含的假資料包羅萬象啊🤣，趕快將此網頁加入"我的最愛(書籤)"，搞不好以後就有機會使用到呢~

如有遇到其他問題，或文章內容有誤，歡迎底下留言~😙

參考：
Faker 官方GitHub
Faker 官方文件

You've got to find what you love.
你必須找到你所愛的。

—— 賈伯斯(Steve Jobs)

Python 使用 Arrow 套件來處理日期時間

jia@jiatool.com (Jia) — Sun, 26 Jul 2020 13:35:00 +0800

前言

在寫網路爬蟲時，應該都會遇到需要解析日期時間的處理，但是Python內建有關日期時間的套件用久了覺得有點卡手，像是有以下缺點：

太多套件(time、datetime、calendar、dateutil、pytz等)。
有時需要在不同格式之間轉換，不是這麼的方便或繁瑣，例如時間格式、字串、時間戳、localtime和utctime、時區。
在某些方面較不直觀或難記，像是格式化字串的參數。

在某天碰巧在網路的論壇中發現有人推薦 Arrow，看了一下，好像蠻不錯用的。

例如我們想把某日期時間字串加上5小時，再轉回字串的話，使用內建的datetime與Arrow來比較：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16


# 使用內建的datetime
from datetime import datetime, timedelta
t = datetime.strptime("2020-07-25 10:00", "%Y-%m-%d %H:%M")
t = t + timedelta(hours=5)
t.strftime("%Y-%m-%d %H:%M")
# 2020-07-25 15:00
# 使用Arrow
import arrow
t = arrow.get("2020-07-25 10:00")
t = t.shift(hours=5)
t.format('YYYY-MM-DD HH:mm')
# 2020-07-25 15:00

安裝

1

pip install arrow

以下以撰寫文章時最新的版本 v0.15.7 為範例。
Arrow 官方GitHub
Arrow 官方文件

功能範例

創建時間

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20


# 當前時間
t = arrow.now()
# 2020-07-25T22:12:08.803133+08:00
# 當前UTC時間
t = arrow.utcnow()
# 2020-07-25T14:12:08.803133+00:00
# 自訂時間
t = arrow.Arrow(2020, 7, 25, 21, 50, 45)
# 2020-07-25T21:50:45+00:00
# 取得其中的數值
t.year
# 2020
t.hour
# 21
t.timestamp # 時間戳
# 1594504245

格式化成字串 [format]

格式化參數放置於文章最後。

1
2
3
4
5


t.format('YYYY/MM/DD HH:mm:ss')
# 2020/07/25 21:50:45
t.format('MMM DD dddd')
# Jul 25 Saturday

轉換為 datetime 函數中的 [datetime、date、time]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


t = arrow.Arrow(2020, 7, 25, 21, 50, 45)
# <class 'arrow.arrow.Arrow'> 2020-07-25T21:50:45+00:00
t.datetime
# <class 'datetime.datetime'> 2020-07-25 21:50:45+00:00
t.date()
# <class 'datetime.date'> 2020-07-25
t.time()
# <class 'datetime.time'> 21:50:45

移動時間 [shift]

參數有 years, months, days, hours, minutes, seconds, microseconds, weeks, quarters, weekday。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


t = arrow.Arrow(2020, 7, 25, 21, 50, 45)
# 3天前
t.shift(days=-3)
# 2020-07-22T21:50:45+00:00
# 50天又2小時後
t.shift(days=50, hours=2)
# 2020-09-13T23:50:45+00:00
# 上星期
t.shift(weeks=-1)
# 2020-07-18T21:50:45+00:00

修改日期 [replace]

1
2
3
4
5
6
7
8


t = arrow.Arrow(2020, 7, 25, 21, 50, 45)
t.replace(year=2025, month=12, day=31)
# 2025-12-31T21:50:45+00:00
# 替換時區
t.replace(tzinfo='Asia/Taipei')
# 2020-07-25T21:50:45+08:00

轉換時區 [to]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


t = arrow.Arrow(2020, 7, 25, 20, 00, 00)
# 2020-07-25T20:00:00+00:00
t.to('Asia/Taipei')
# 2020-07-26T04:00:00+08:00
t.to('local')
# 2020-07-26T04:00:00+08:00
t.to('utc')
# 2020-07-25T20:00:00+00:00

從不同的格式轉換為Arrow格式 [get]

他還可以自動判斷！

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23


arrow.get('2020/10/09 16:15:14')
# 2020-10-09T16:15:14+00:00
arrow.get('2020-07-30T01:26:43.8')
# 2020-07-30T01:26:43.800000+00:00
arrow.get(datetime(2020, 7, 25, 10, 10, 30))
# 2020-07-25T10:10:30+00:00
arrow.get(date(2020, 7, 25))
# 2020-07-25T00:00:00+00:00
arrow.get(2020, 7, 25, 12, 30, 45)
# 2020-07-25T12:30:45+00:00
arrow.get("2020-07-25 11:30", "YYYY-MM-DD HH:mm")
# 2020-07-25T11:30:00+00:00
arrow.get(1595651445)
# 2020-07-25T04:30:45+00:00
arrow.get("1595651445", "X")
# 2020-07-25T04:30:45+00:00

產生一段範圍 [range span]

range：時間範圍內依某級別(hour)產生時間點
span：初始與結尾時間點

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


start = arrow.Arrow(2020, 7, 25, 11, 50)
end = arrow.Arrow(2020, 7, 25, 13, 50)
for t in arrow.Arrow.range('hour', start, end):
print(t)
# 2020-07-25T11:50:00+00:00
# 2020-07-25T12:50:00+00:00
# 2020-07-25T13:50:00+00:00
arrow.now().span('hour')
# (<Arrow [2020-07-25T11:00:00+08:00]>, <Arrow [2020-07-25T11:59:59.999999+08:00]>)
arrow.now().span('hour', count=2)
# (<Arrow [2020-07-25T11:00:00+08:00]>, <Arrow [2020-07-25T12:59:59.999999+08:00]>)

人性化(敘述)方式呈現 [humanize]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


arw = arrow.now().shift(hours=1)
arw.humanize()
# in an hour
arw = arrow.now().shift(hours=-2)
arw.humanize()
# 2 hours ago
# 也可以用中文顯示哦！！
# https://github.com/crsmithdev/arrow/blob/master/arrow/locales.py
arw.humanize(locale="zh_tw")
# 2小時前
# 指定要顯示的級別
arw = arrow.utcnow().shift(seconds=+8400)
arw.humanize(granularity="minute", locale="zh_tw")
# 140分鐘後
arw.humanize(granularity=["hour", "minute"], locale="zh_tw")
# 2小時 和 20分鐘後
# 也可以拿兩個時間來比對
a = arrow.now()
b = arrow.now().shift(weeks=1)
a.humanize(b, locale="zh_tw")
# 1週前

解析和格式化參數

說明	語法	結果
Year 年	YYYY	2000, 2001, 2002 … 2012, 2013
	YY	00, 01, 02 … 12, 13
Month 月	MMMM	January, February, March …
	MMM	Jan, Feb, Mar …
	MM	01, 02, 03 … 11, 12
	M	1, 2, 3 … 11, 12
Day of Year 一年中的天數	DDDD	001, 002, 003 … 364, 365
	DDD	1, 2, 3 … 364, 365
Day of Month 一個月中的天數	DD	01, 02, 03 … 30, 31
	D	1, 2, 3 … 30, 31
	Do	1st, 2nd, 3rd … 30th, 31st
Day of Week 一週中的天數	dddd	Monday, Tuesday, Wednesday …
	ddd	Mon, Tue, Wed …
	d	1, 2, 3 … 6, 7
Hour 小時	HH	00, 01, 02 … 23, 24
	H	0, 1, 2 … 23, 24
	hh	01, 02, 03 … 11, 12
	h	1, 2, 3 … 11, 12
AM / PM	A	AM, PM, am, pm
	a	am, pm
Minute 分鐘	mm	00, 01, 02 … 58, 59
	m	0, 1, 2 … 58, 59
Second 秒	ss	00, 01, 02 … 58, 59
	s	0, 1, 2 … 58, 59
Sub-second	S	0, 02, 003, 000006, 123123123123…
Timezone 時區	ZZZ	Asia/Taipei, Europe/Warsaw, GMT …
	ZZ	-08:00, -07:00 … +07:00, +08:00
	Z	-0800, -0700 … +0700, +0800
Seconds Timestamp 時間戳	X	1381685817, 1381685817.915482
ms or µs Timestamp 時間戳	x	1569980330813, 1569980330813221

結語

其他更進階的語法可以前往 Arrow 官方文件查閱~

相比Python內建的日期時間套件，用起來應該清楚、好用吧。
只是缺點是使用前要先安裝。

如有遇到其他問題，或文章內容有誤，歡迎底下留言~😙

參考：
Arrow 官方GitHub
Arrow 官方文件

當你認為全世界都在跟你做對時，
請記得飛機是逆風而飛的。

Python套件 on IT 空間

透過 Docling 輕鬆解析常見文件，匯出成 JSON、Markdown、HTML 格式

前言

安裝套件

使用教學 & 範例程式碼

設定文件來源

轉換文件

輸出結果

完整範例程式碼

切割 chunk

其他

結語

Streamlit 使用 Nginx 佈署在網址其他路徑

前言

設定細節

環境

Nginx 設定

Streamlit 指令

結語

(2023年新版) 使用 Streamlit 簡單又快速建立 Dashboard 網頁

前言

Demo

安裝與執行

創建 Streamlit 應用程式

新增 py 程式碼

添加文字和數據

使用 st.write 和 Magic Commands

繪製圖表和地圖 Chart

折線圖 st.line_chart()

地圖 st.map()

輸入類元件

按鈕 st.button()

複選框 st.checkbox()

選擇框 st.selectbox()

調整佈局 Layout

側邊欄 st.sidebar

列容器 st.columns()

展開容器 st.expander()

分頁容器 st.tabs()

狀態元件 Status

進度條 st.progress()

消息通知 st.toast()

box 訊息 st.success()、st.info()、st.warning()、st.error()

特效 st.balloons() 與 st.snow()

聊天元件 Chat

聊天元件 st.chat_message() 與 st.chat_input()

表單元件

表單 st.form()

使用快取 Caching

網頁配置設定

更多的元件、工具

部署應用程式

完整範例程式碼

結語

Playwright 瀏覽器自動化工具，應用於網路爬蟲和測試

前言

Playwright 套件簡介

教學

常見的基本操作

元素定位

選取元素

瀏覽器參數

Cookies 和 Local Storage

結語

FinMind API 取得"台股、匯率、黃金"等金融相關資料

前言

FinMind 套件簡介

教學

股價日成交資訊

股票當日逐筆成交資訊

股票綜合損益表

股利政策表

外幣對台幣匯率

範例程式碼

流量限制 & 會員機制

結語

Streamlit 超快速又輕鬆建立網頁 Dashboard

前言

Demo

安裝與執行

使用 `st.write` 和 Magic Commands

折線圖 `st.line_chart()`

地圖 `st.map()`

按鈕 `st.button()`

複選框 `st.checkbox()`

選擇框 `st.selectbox()`

側邊欄 `st.sidebar`

列容器 `st.columns()`

展開容器 `st.expander()`

分頁容器 `st.tabs()`

進度條 `st.progress()`

消息通知 `st.toast()`

box 訊息 `st.success()`、`st.info()`、`st.warning()`、`st.error()`

特效 `st.balloons()` 與 `st.snow()`

聊天元件 `st.chat_message()` 與 `st.chat_input()`

表單 `st.form()`

解析和格式化參數