🔦 Optical Transceiver Module Demo | 光模块工作原理演示

An interactive visualization demonstrating how optical transceiver modules work, featuring real-time animations of signal conversion and transmission.

一个交互式可视化演示，展示光模块的工作原理，包含实时的信号转换与传输动画。

✨ Features | 功能特点

• Dual Mode Simulation | 双模式仿真

  • Transmit Mode (Tx): Electrical → Optical signal conversion
  • Receive Mode (Rx): Optical → Electrical signal conversion

• Visual Signal Differentiation | 信号可视化区分

  • Electrical signals: Orange rectangular particles with jitter effect
  • Optical signals: Circular particles with glow and ripple effects

• Fiber Optic Simulation | 光纤传输模拟

  • Zigzag propagation path simulating total internal reflection
  • Visible fiber boundaries with reflection sparks

• Speed Difference | 速度差异展示

  • Optical signals propagate ~2.4x faster than electrical signals

• Real-time Parameters | 实时参数显示

  • 400 Gb/s transmission rate
  • PAM4 modulation format
  • 1310nm wavelength

🖼️ Preview | 预览

🚀 Live Demo | 在线演示

👉 Click here to view the live demo

🔧 How to Use | 使用方法

1. Open the demo in your browser
2. Click "启动" (Start) to begin the animation
3. Switch between modes using the "发送模式" (Tx) and "接收模式" (Rx) buttons
4. Hover over components to see detailed information
5. Click "重置" (Reset) to restart the animation

📚 Technical Background | 技术背景

Transmit Path (Tx)

Electric Signal → DSP → Driver IC → Laser (DFB) → Optical Fiber

Receive Path (Rx)

Optical Fiber → Photodetector (PIN/APD) → TIA → DSP → Electric Signal

Key Components | 核心组件

Component	Function
DSP	Digital signal processing, pre-emphasis & equalization
Driver IC	Converts voltage to driving current (40-100mA)
Laser (DFB)	Electro-optical conversion, wavelength: 850/1310/1550nm
Photodetector	Optical-electrical conversion, responsivity: 0.8-1.0 A/W
TIA	Transimpedance amplifier, gain: 1-10 kΩ

🛠️ Technology Stack | 技术栈

• Pure HTML5 + CSS3 + JavaScript
• No external dependencies
• Responsive design

📁 File Structure | 文件结构

optical-transceiver-model/
├── index.html          # Main demo file
├── README.md           # This file
└── 光模块演示解说稿.md  # Presentation script (Chinese)

📄 License | 许可证

MIT License - feel free to use and modify.

🙏 Acknowledgments | 致谢

Inspired by the growing importance of optical transceivers in modern data communication infrastructure.

---

Made with ❤️ for optical communication education