← Back to list

Python 學習筆記 --- 好用的Bokeh package

平常不管是工作上或是日常生活中常常會用到趨勢表這個東西來表示某些特定的index隨著時間上的變化,其中最具代表性的就是股價的趨勢圖,尤其最近台灣的股市行情又蒸蒸日上🤣🤣

Chuuuuu · 2026-01-25 11:20 · 2 claps · 11.0 min read
#python #stock-market #bokeh
Open on Medium ↗
Wiki topics: INV · Investing & Markets ECO · Economy · General

Python 學習筆記 --- 好用的Bokeh package

平常不管是工作上或是日常生活中常常會用到趨勢表這個東西來表示某些特定的index隨著時間上的變化,其中最具代表性的就是股價的趨勢圖,尤其最近台灣的股市行情又蒸蒸日上🤣🤣

yahoo奇摩 元大台灣50(0050)股價趨勢圖

yahoo奇摩 元大台灣50(0050)股價趨勢圖

以上圖為例,yahoo奇摩股市裏面就可以輸入台股代號來搜尋你想要的股票資訊,並點技術分析來看到股價的趨勢圖,還搭配有游標顯示日期 / 開 / 高點 / 低點 / 收盤價的資訊。

以我個人來說,我不會只有投資一支股票,而是同時投資不同公司來達到分散風險的目的(也代表不能大賺錢就是了😅😅),所以這次的目標就是編寫一個python的code來達到一次性query出想要的股票並畫出類似yahoo的股票趨勢表。在python裡面用來繪圖的package大家比較熟知的應該是matplotlib / seaborn,不過這次要用的是Bokeh package可以輕鬆地做出這種有簡單互動功能的HTML圖表檔。

[embed]Bokeh Bokeh is a Python-based visualization library, capable of building plots from simple charts to interactive dashboards.bokeh.org

下面是這次練習的python code,大概可以拆成幾個部分

import yfinance as yf #yahoo finance package
import pandas as pd
from bokeh.plotting import figure, output_file, save, show
from bokeh.layouts import gridplot
from bokeh.models import HoverTool, ColumnDataSource
import math

# 讓user輸入股票代碼
stocks = input("請輸入股票代碼(用逗號分隔):") 
stock_list = [s.strip() for s in stocks.split(",")] #把user輸入的字串用逗號切開病並變成一個list 結果會變成[0050.TW,2330.TW....]

# 下載最近 6 個月的資料
data = yf.download(
    stock_list,
    period="6mo",
    interval="1d"
)   #利用yf package把stock_list裡面的股票數據query出來

# 只取收盤價
close_price = data["Close"]

# 計算子圖排列方式
n = len(stock_list)#算出總共有幾張圖要畫
cols = 2 #限制行數只能有兩行
rows = math.ceil(n / cols)#計算列數的最大值

plots = [] #建立一個空的list來存放等一下每一個畫出來的圖表

for stock in stock_list: #用for迴圈loop每一隻要畫的股票
    df = close_price[[stock]].reset_index() #從close_price的data table中取出迴圈定義到的那支股票
    df.rename(columns={stock: "Close"}, inplace=True) #將stock名稱改成收盤價
    df["MA5"] = df["Close"].rolling(window=5).mean() #計算5日的移動平均數,rolling (window=5)代表每五天計算一次平均值
    df["MA20"] = df["Close"].rolling(window=20).mean() #同5日移動平均邏輯,但改成20天
    source = ColumnDataSource(df) #定義source讓bokeh去讀取資料,這是跟matplotlib最大不同的地方

    print (df)

    # 建立Bokeh 圖表
    p = figure(
        title=f"{stock} 近六個月收盤價",
        x_axis_type='datetime', #把x軸改成時間的data type
        width=1000,
        height=600,
        tools="pan,wheel_zoom,box_zoom,reset,save" #這一行是定義圖表有哪些功能
    )

    # 加入要有的線,以這個例子來說就是有收盤價 / 五日線 / 二十日線
    p.line("Date", "Close", source=source, line_width=2, color="black", alpha=0.7,legend_label="close price") #裡面的參數依序是X , Y , 數據來源, 線的顏色, 透明度 , 分類
    p.line("Date", "MA5",source=source,line_width=2,color="green",alpha=0.5,legend_label="5MA")
    p.line("Date", "MA20",source=source,line_width=2,color="red",alpha=0.5,legend_label="20MA")

    # 加入要有的data point,這邊就只有用收盤價用點顯示出來
    close_price_scatter = p.scatter("Date", "Close", source=source, size=6, marker="circle", color="blue", alpha=0.6)

    # 定義hover tool
    hover = HoverTool(
        renderers=[close_price_scatter], #讓只有close_price_scatter對hover有反應
        tooltips=[                       #加入hover移動到點上的時候要顯示那些資訊
            ("日期", "@Date{%F}"),       #顯示名稱跟reference的東西是甚麼
            ("收盤價", "@Close{0.2f}"),
            ("5MA", "@MA5{0.2f}"),
            ("20MA", "@MA20{0.2f}")
        ],
        formatters={
            '@Date': 'datetime',
        },
        mode='mouse'
    )
    p.add_tools(hover) #加入hover tool

    p.xaxis.axis_label = "日期"
    p.yaxis.axis_label = "價格"

    plots.append(p) #把畫出來的圖表p加入到plots list裡面

grid = gridplot(plots, ncols=cols, sizing_mode='fixed') #用gridplot排列所有的圖,並定義是plolts list裡面的所有的圖

output_file("stocks_6months_scatter.html", title="近六個月股票收盤價趨勢") #執行完會生成的HTML檔名和標題
save(grid)#存檔
show(grid)#自動用瀏覽器打開
  1. Package會用到yfinance , pandas , bokeh , math
  2. code可以分成2個部分,第一部分是將股票data抓下來並處理,第二部分是用bokeh package繪製圖表
  3. data 抓取下來的table大概會長這樣
Price           Close       High        Low       Open     Volume
Ticker        0050.TW    0050.TW    0050.TW    0050.TW    0050.TW
Date                                                             
2025-07-23  49.994366  50.142276  49.846452  49.895755   63766890
2025-07-24  50.290188  50.388795  50.092971  50.290188   79659820
2025-07-25  50.191582  50.388795  50.092971  50.290188   38620389
2025-07-28  50.339493  50.684624  50.191583  50.487407   52312766
2025-07-29  49.747845  50.339492  49.550628  50.339492  102624231
              ...        ...        ...        ...        ...
2026-01-19  71.589561  71.786782  70.455566  70.702086  116848644
2026-01-20  71.589561  71.638869  70.850000  70.899307  104977401
2026-01-21  70.849998  71.490953  70.702085  70.800699  161269608
2026-01-22  71.800003  72.050003  71.599998  71.900002   96360058
2026-01-23  72.250000  72.300003  71.800003  72.099998   68701320

[127 rows x 5 columns]

我們先將只有close price的部分取出

Ticker        0050.TW
Date                 
2025-07-23  49.994366
2025-07-24  50.290188
2025-07-25  50.191582
2025-07-28  50.339493
2025-07-29  49.747845
              ...
2026-01-19  71.589561
2026-01-20  71.589561
2026-01-21  70.849998
2026-01-22  71.800003
2026-01-23  72.250000

[127 rows x 1 columns]

進到迴圈會summary出要用來畫圖的data table df

Ticker       Date      Close        MA5       MA20
0      2025-07-23  49.994366        NaN        NaN
1      2025-07-24  50.290188        NaN        NaN
2      2025-07-25  50.191582        NaN        NaN
3      2025-07-28  50.339493        NaN        NaN
4      2025-07-29  49.747845  50.112695        NaN
..            ...        ...        ...        ...
122    2026-01-19  71.589561  70.347099  66.932791
123    2026-01-20  71.589561  70.721811  67.430762
124    2026-01-21  70.849998  70.938748  67.847381
125    2026-01-22  71.800003  71.365408  68.296710
126    2026-01-23  72.250000  71.615825  68.761143

[127 rows x 4 columns]
  1. 數據準備好後基本上就可以來畫圖了,bokeh我自己使用起來有一個地方跟matplotlib很不一樣的是他需要將數據table定義成你的source讓後面的function讀取,不過基本上邏輯差不多都是先建立figure → 寫下要在figure裡面加入的東西(scatter plot / line plot …) → 繪圖
p = figure(
  title,
  width,
  height,
  tools,
  )
p.line(x , y, source )
p.scatter(x , y , source )
hover = HoverTool(
  tooltips=[],
  formatters= {},
  mode = 'mouse'
    )
p.add_tools(hover)

在定義figure裡面還可以加入我們想要的tool包含移動/ box zoom / wheel zoom / reset / save / hover。執行後就可以看到bokeh生成的html file,就可以用瀏覽器打開非常方便。

  1. 來看看執行的結果

先輸入任何想要看的股票代碼

先輸入任何想要看的股票代碼

就會得到四支股票的趨勢圖

就會得到四支股票的趨勢圖

接著可以來玩一下有的功能

move function

move function

box and wheel zoom function

box and wheel zoom function

reset and save function

reset and save function

hover tool

hover tool

總結來說,這次使用bokeh來做這個圖表非常的直覺也方便,還可以加上一些基本的功能,比如在看圖表時常常需要放大縮小用滑鼠的滾輪就可以解決,還有hover tool點到顯示實際數值的功能也非常實用,以後要看股票分析也可以使用python tool來看了!


메타데이터
post_id
d5ec3fcb7259
slug
python-學習筆記-好用的bokeh-package-d5ec3fcb7259
url
https://medium.com/@peter225295/python-%E5%AD%B8%E7%BF%92%E7%AD%86%E8%A8%98-%E5%A5%BD%E7%94%A8%E7%9A%84bokeh-package-d5ec3fcb7259
canonical_url
https://medium.com/@peter225295/python-%E5%AD%B8%E7%BF%92%E7%AD%86%E8%A8%98-%E5%A5%BD%E7%94%A8%E7%9A%84bokeh-package-d5ec3fcb7259
author_url
https://medium.com/@peter225295
status
ok
fetched_at
2026-06-23 03:48:11