我的Side Project每拍呷 | 視覺化資訊篇

更新 發佈閱讀 5 分鐘

今日進度 2/14

今天主要針對成分表裡的「食品添加物」做分類,初步分成:香料、防腐劑、乳化劑、色素、其他。
使用者輸入文字內容後,系統就能輸出圓餅圖或其他視覺化的分析結果。
但是!實作之後改動了超多東西的,不停發現盲點... ...

---

食品添加物分類挑戰

一開始我跑去衛福部食藥署查食品添加物,結果竟然有81頁
總共有17類,包括:
- 防腐劑
- 殺菌劑
- 抗氧化劑
- 漂白劑
- 保濕劑
- 膨脹劑
- 品質改良用劑
- 營養添加劑
- 著色劑
- 香料調味劑
- 甜味劑
- 黏稠劑
- 接著劑
- 食品工業用化學藥品
- 載體
- 乳化劑
- 其他

如果全部17類都畫進圓餅圖,光看就能練出老花眼(汗)。
所以我決定簡化,最後將 ADDITIVE_CATEGORIES 歸納為五種:

- 防腐劑
- 抗氧化劑
- 著色劑
- 香料 / 甜味劑 / 調味劑
- 其他

這樣更直觀,也符合新聞或健康資訊裡最常提到的分類。

---

從圓餅圖到長條圖

本來我想用 Matplotlib 畫圓餅圖,但遇到兩個小麻煩:

1. 繁體中文顯示亂碼。
2. 我希望文字能放在圖裡,但它偏偏要跑到外面。

所以乾脆改成長條圖,還下載了中文字型。
結果就在準備開工的時候──靈光一閃,發現了一個盲點!

成分表是依含量由多到少排列,例如: 【馬鈴薯、棕櫚油、香辛料、糖、調味劑、大豆水解蛋白】
其中「馬鈴薯」才是主角,但它並不是食品添加物。
若我把所有非分類項目丟到「其他」,那「其他」的比例就會膨脹得超大,完全失焦。

---

修正策略:只統計「食品添加物」

✔️ 如果成分能對應到五大類,就算是「被偵測到的添加物」。
✔️ 如果沒有對應到,就視為一般原料(如馬鈴薯、水、糖),直接忽略。

這樣邏輯就清楚多了 ✅

食品添加物長條圖

食品添加物長條圖


---

新的思考:為何不改成營養素?

但問題來了:「生成長條圖的意義是什麼?要提醒使用者少吃一點嗎?」
其實食品添加物本來就是加工食品的必要一環,單純數量統計很難直接建議「該不該吃」。
於是我靈機一動:

👉 為什麼不改成視覺化營養素呢?Bingo!🎉

---

第三次調整方向

  1. 加入性別選項(因為營養素建議攝取量跟性別有關)
    - 生理男性基準熱量:依據BMI計算
    - 生理女性基準熱量:依據BMI計算
    - 蛋白質:生理男性 70g / 生理女性 60g
    - 脂肪:佔總熱量 25%
    - 碳水化合物:佔總熱量 55%
    - 總糖:佔總熱量 10%
  2. BMI對應一日建議熱量
    - BMI < 18.5 → 過輕 → 體重 × 35 大卡
    - BMI 18.5–24 → 正常 → 體重 × 30 大卡
    - BMI ≥ 24 → 過重 → 體重 × 20 大卡
  3. 新增蛋白質輸入欄位(因為蛋白質對肌肉維持很重要)

---

最終視覺化呈現

依照用戶吃的份量(整包、半包、1/4包)繪製「每日營養素攝取比例」長條圖,顯示「碳水化合物、蛋白質、總脂肪、總糖、總鈉」各自佔每日建議攝取量的百分比。

顏色規則:

- 🔴 蛋白質
- 🟡 碳水化合物
- 🟠 總脂肪
- 🟢 總糖
- 🔵 總鈉

這次直接靠顏色標示,不用再煩惱中文字型啦!

raw-image
1/4包500克的洋芋片真的是增肥神器...

1/4包500克的洋芋片真的是增肥神器...

邊做邊修正,改動超多東西,真是有趣XD

明日進度:
設定 Azure AI Services (或 Azure Cognitive Services for Vision) 的 OCR 服務。撰寫一個簡單的 Python 程式碼,使用一個營養標示圖片進行 OCR 服務呼叫,並印出返回的 JSON 結構,確認服務能正常運作。

加油!!

留言
avatar-img
留言分享你的想法!
avatar-img
Galing的腦內劇場
1會員
15內容數
學習AI的新手,在這邊分享學習筆記跟知識,希望文組轉戰AI也可以闖出一片天💪 大學學的是戲劇,擁有服務業12年經驗,擔任銷售顧問;2025.07開始學習python與AI商業應用,目標是讓職涯變得更自由有彈性,做出好玩有趣的東西! 💬喜歡打電動、看動畫、K-pop佛系追星,偶爾可能會出現這些主題的文章。
Galing的腦內劇場的其他內容
2025/08/20
繼續做我的AI Side Project:「每拍呷-營養標示一拍就懂」🫡 ✔️今日進度1/14:確認營養標示算法、蒐集資料、統整國民健康署DIRS、把熱量&鈉&糖&脂肪換算成白飯&醬油&方糖&沙拉油、暫時先用GRADIO介面做初步的測試。
Thumbnail
2025/08/20
繼續做我的AI Side Project:「每拍呷-營養標示一拍就懂」🫡 ✔️今日進度1/14:確認營養標示算法、蒐集資料、統整國民健康署DIRS、把熱量&鈉&糖&脂肪換算成白飯&醬油&方糖&沙拉油、暫時先用GRADIO介面做初步的測試。
Thumbnail
2025/08/19
在初步學習了Python、Gradio、Azure、SQL&NoSQL、LINE BOT之後,終於要開始做我的第一個AI Side Project--每拍呷-營養標示一拍就懂! 目標:兩周內完成(瑟瑟發抖)
Thumbnail
2025/08/19
在初步學習了Python、Gradio、Azure、SQL&NoSQL、LINE BOT之後,終於要開始做我的第一個AI Side Project--每拍呷-營養標示一拍就懂! 目標:兩周內完成(瑟瑟發抖)
Thumbnail
2025/08/16
首先讚嘆Azure的資源超級豐富💯 不過初學Azure時,複雜的介面+文件常常讓我感到滿頭問號; 一堆資源、服務又很多種,像是目前學了Cognitive Service、Translator、Speech、Vision、tts、Whisper…所以,寫程式時要記得抓對金鑰跟端點,還有記得檢查定價層
Thumbnail
2025/08/16
首先讚嘆Azure的資源超級豐富💯 不過初學Azure時,複雜的介面+文件常常讓我感到滿頭問號; 一堆資源、服務又很多種,像是目前學了Cognitive Service、Translator、Speech、Vision、tts、Whisper…所以,寫程式時要記得抓對金鑰跟端點,還有記得檢查定價層
Thumbnail
看更多