legacy-circuit-mockups

legacy-circuit-mockups

熱門

使用 HTML5 Canvas 繪圖技術生成麵包板電路模型與視覺圖表。當被要求建立電路佈局、視覺化電子元件放置、繪製麵包板圖、製作 6502 電腦模型、生成復古電腦電路圖或設計老式電子專案時使用。支援 555 定時器、W65C02S 微處理器、28C256 EEPROM、W65C22 VIA 晶片、7400 系列邏輯閘、LED、電阻、電容、開關、按鈕、晶振和導線。

3.6萬星標
4556分支
更新於 2026/7/13
SKILL.md
readonlyread-only
name
legacy-circuit-mockups
description

使用 HTML5 Canvas 繪圖技術生成麵包板電路模型與視覺圖表。當被要求建立電路佈局、視覺化電子元件放置、繪製麵包板圖、製作 6502 電腦模型、生成復古電腦電路圖或設計老式電子專案時使用。支援 555 定時器、W65C02S 微處理器、28C256 EEPROM、W65C22 VIA 晶片、7400 系列邏輯閘、LED、電阻、電容、開關、按鈕、晶振和導線。

Legacy Circuit Mockups

一個用於建立麵包板電路模型與視覺圖表的技能,專為復古運算與電子專案設計。此技能利用 HTML5 Canvas 繪圖機制來渲染互動式電路佈局,包含 6502 微處理器、555 定時器 IC、EEPROM 和 7400 系列邏輯閘等老式元件。

何時使用此技能

  • 使用者要求「建立麵包板佈局」或「製作電路模型」
  • 使用者想要視覺化元件在麵包板上的放置
  • 使用者需要建立 6502 電腦的視覺參考
  • 使用者要求「繪製電路」或「圖解電子元件」
  • 使用者想要建立教育用電子視覺教材
  • 使用者提及 Ben Eater 教學或復古運算專案
  • 使用者要求製作 555 定時器電路或 LED 專案模型
  • 使用者需要視覺化元件之間的導線連接

先決條件

  • 了解隨附參考檔案中的元件接腳定義
  • 熟悉麵包板佈局慣例(行、列、電源軌)

支援的元件

微處理器與記憶體

元件 接腳 說明
W65C02S 40-pin DIP 8 位元微處理器,具 16 位元位址匯流排
28C256 28-pin DIP 32KB 並列 EEPROM
W65C22 40-pin DIP 多功能介面轉接器 (VIA)
62256 28-pin DIP 32KB 靜態 RAM

邏輯與定時器 IC

元件 接腳 說明
NE555 8-pin DIP 定時 IC,用於計時與振盪
7400 14-pin DIP 四組 2 輸入 NAND 閘
7402 14-pin DIP 四組 2 輸入 NOR 閘
7404 14-pin DIP 六反相器 (NOT 閘)
7408 14-pin DIP 四組 2 輸入 AND 閘
7432 14-pin DIP 四組 2 輸入 OR 閘

被動與主動元件

元件 說明
LED 發光二極體(多種顏色)
電阻 限流(可設定數值)
電容 濾波與定時(陶瓷/電解)
晶振 時鐘振盪器
開關 切換開關(自鎖型)
按鈕 瞬時按壓按鈕
可變電阻 可變電阻器
光敏電阻 光依賴型電阻

網格系統

// 標準麵包板網格:間距 20px
const gridSize = 20;
const cellX = Math.floor(x / gridSize) * gridSize;
const cellY = Math.floor(y / gridSize) * gridSize;

元件渲染模式

// 所有元件遵循此結構:
{
  type: 'component-type',
  x: gridX,
  y: gridY,
  width: componentWidth,
  height: componentHeight,
  rotation: 0,  // 0, 90, 180, 270
  properties: { /* 元件特定資料 */ }
}

導線連接

// 導線連接格式:
{
  start: { x: startX, y: startY },
  end: { x: endX, y: endY },
  color: '#ff0000'  // 導線顏色編碼
}

逐步工作流程

建立基本 LED 電路模型

  1. 定義麵包板尺寸與網格
  2. 放置電源軌連接(+5V 和 GND)
  3. 加入 LED 元件,標明陽極/陰極方向
  4. 放置限流電阻
  5. 繪製元件間的導線連接
  6. 加入標籤與註解

建立 555 定時器電路

  1. 將 NE555 IC 放置在麵包板上(接腳 1-4 在左,5-8 在右)
  2. 連接接腳 1 (GND) 到接地軌
  3. 連接接腳 8 (Vcc) 到電源軌
  4. 加入定時電阻與電容
  5. 接線觸發與閾值連接
  6. 將輸出連接到 LED 或其他負載

建立 6502 微處理器佈局

  1. 將 W65C02S 置中放在麵包板上
  2. 加入 28C256 EEPROM 作為程式儲存
  3. 放置 W65C22 VIA 作為 I/O
  4. 加入 7400 系列邏輯閘進行位址解碼
  5. 接線位址匯流排 (A0-A15)
  6. 接線資料匯流排 (D0-D7)
  7. 連接控制訊號 (R/W, PHI2, RESB)
  8. 加入重置按鈕與時鐘晶振

元件接腳快速參考

555 定時器 (8-pin DIP)

接腳 名稱 功能
1 GND 接地 (0V)
2 TRIG 觸發 (< 1/3 Vcc 開始計時)
3 OUT 輸出 (可源/汲 200mA)
4 RESET 低電位重置
5 CTRL 控制電壓 (旁路接 10nF)
6 THR 閾值 (> 2/3 Vcc 重置)
7 DIS 放電 (開集極)
8 Vcc 電源 (+4.5V 至 +16V)

W65C02S (40-pin DIP) - 關鍵接腳

接腳 名稱 功能
8 VDD 電源
21 VSS 接地
37 PHI2 系統時鐘輸入
40 RESB 低電位重置
34 RWB 讀/寫訊號
9-25 A0-A15 位址匯流排
26-33 D0-D7 資料匯流排

28C256 EEPROM (28-pin DIP) - 關鍵接腳

接腳 名稱 功能
14 GND 接地
28 VCC 電源
20 CE 晶片致能 (低電位)
22 OE 輸出致能 (低電位)
27 WE 寫入致能 (低電位)
1-10, 21-26 A0-A14 位址輸入
11-19 I/O0-I/O7 資料匯流排

公式參考

電阻計算

  • 歐姆定律: V = I × R
  • LED 電流: R = (Vcc - Vled) / Iled
  • 功率: P = V × I = I² × R

555 定時器公式

無穩態模式:

  • 頻率:f = 1.44 / ((R1 + 2×R2) × C)
  • 高電位時間:t₁ = 0.693 × (R1 + R2) × C
  • 低電位時間:t₂ = 0.693 × R2 × C
  • 工作週期:D = (R1 + R2) / (R1 + 2×R2) × 100%

單穩態模式:

  • 脈衝寬度:T = 1.1 × R × C

電容計算

  • 容抗:Xc = 1 / (2πfC)
  • 儲存能量:E = ½ × C × V²

顏色編碼慣例

導線顏色

顏色 用途
紅色 +5V / 電源
黑色 接地
黃色 時鐘 / 定時
藍色 位址匯流排
綠色 資料匯流排
橙色 控制訊號
白色 通用

LED 顏色

顏色 順向電壓
紅色 1.8V - 2.2V
綠色 2.0V - 2.2V
黃色 2.0V - 2.2V
藍色 3.0V - 3.5V
白色 3.0V - 3.5V

建置範例

建置 1 — 單顆 LED

元件: 紅色 LED、220Ω 電阻、跳線、電源

步驟:

  1. 將黑色跳線從電源 GND 插入第 A5 行
  2. 將紅色跳線從電源 +5V 插入第 J5 行
  3. 放置 LED,陰極(短腳)對齊 GND 行
  4. 將 220Ω 電阻連接在電源與 LED 陽極之間

建置 2 — 555 無穩態閃爍器

元件: NE555、LED、電阻 (10kΩ, 100kΩ)、電容 (10µF)

步驟:

  1. 將 555 IC 跨放在中央通道上
  2. 連接接腳 1 到 GND,接腳 8 到 +5V
  3. 連接接腳 4 到接腳 8(停用重置)
  4. 將 10kΩ 連接在接腳 7 與 +5V 之間
  5. 將 100kΩ 連接在接腳 6 與 7 之間
  6. 將 10µF 連接在接腳 6 與 GND 之間
  7. 將接腳 3(輸出)連接到 LED 電路

故障排除

問題 解決方案
LED 不亮 檢查極性(陽極接 +,陰極接 -)
電路不通電 確認電源軌連接
IC 不工作 檢查 VCC 和 GND 接腳連接
555 不振盪 確認閾值/觸發電容接線
微處理器卡住 檢查重置脈衝後 RESB 是否為高電位

參考資料

詳細的元件規格請參閱隨附的參考檔案: