一个基于 React 的交互式光通信学习与实验平台,通过精美的动画和实时参数控制,帮助理解光调制器件的工作原理。
分为 Learn(学习) 和 Playground(实验) 两大部分,从基础概念到完整光通信系统,循序渐进。
GitHub Pages: https://saicem.github.io/optoelectro-lab/
共 31 个章节,按 5 个篇章 + 附录分组,形成完整学习体系:
Part 1 · 基础篇
- 01 光波基础与物理量 — 电磁波谱、光波物理量、相位与折射率
- 02 晶体结构与缺陷 — 晶格、晶向、晶体缺陷及其对光电器件的影响
- 03 半导体基础 — 能带结构、本征/掺杂半导体、费米能级、载流子输运
- 04 PN 结基础 — PN 结形成、内建电场、能带图、整流特性
- 05 载流子复合机制 — 辐射复合、SRH 复合、俄歇复合、少子寿命
- 06 光与物质相互作用 — 受激吸收/辐射、粒子数反转、增益
- 07 异质结与能带对准 — 同质结/异质结、能带对准类型、载流子限制
- 08 半导体基本方程 — 泊松方程、连续性方程、漂移扩散方程
- 09 PN 结进阶 — 耗尽区电容、暗电流组成、温度依赖
- 10 光电效应与光电器件 — 光电效应、光电二极管、电光/非线性材料
Part 2 · 光源与传输篇
- 11 激光器 — 受激辐射、粒子数反转、谐振腔、DFB/VCSEL
- 12 光纤与光波导 — 全内反射、损耗谱、色散、非线性效应
Part 3 · 调制器篇
- 13 光调制基础 — 模拟/数字调制、AM/PM/FM、IM/DD、调制性能指标
- 14 干涉原理 — 双光束干涉、相干条件、MZI 结构
- 15 MZ 调制器 — 马赫-曾德电光调制器、三种调制模式、行波电极
- 16 IQ 调制器 — 正交幅度调制、星座图、格雷编码
- 17 偏振复用 — 斯托克斯矢量、琼斯矩阵、庞加莱球
- 18 Nyquist 与 OFDM — 脉冲整形、多载波调制
- 19 概率星座整形与编码 — PCS、LDPC/FEC、逼近香农极限
Part 4 · 系统篇
- 20 光接收器 — 相干接收、噪声分析、功率预算、BER
- 21 WDM 与光放大器 — 波分复用、EDFA、ASE 噪声、Flex-Grid
- 22 完整光通信系统 — 400G DP-16QAM 端到端链路全景、综合回顾
Part 5 · 光学仪器篇
- 23 光源与发射设备 — LD/SLED/ASE/LED/白光源,选型与工程指标
- 24 光功率计与探测器 — 热电堆/光电二极管,响应度、NEP、校准
- 25 积分球与光辐射测量 — 辐射/光度量、余弦修正、光通量测量
- 26 光开关与光路由 — 机械/MEMS/热光/电光开关、WSS
- 27 光谱仪与波长计 — 光栅/OSA/FTIR/波长计、RBW、动态范围
- 28 光纤参数测量与故障定位 — OTDR/CD/PMD/端面检测/熔接机
- 29 时域测试与误码分析 — 光示波器/BERT/LCA/相位噪声
- 30 光束表征与偏振测量 — 光束剖面仪/M²/偏振计/PDL·PMD
- 31 无源光器件 — 衰减器/隔离器/环形器/分束器/滤波器
附录
- 术语表 — 140+ 光通信常用术语查询
5 个可交互的仿真实验,支持实时参数调节:
| 实验 | 功能特点 |
|---|---|
| 光波干涉 | 调节波长/振幅/相位差,观察干涉条纹变化 |
| MZ 调制器 | 电光调制原理演示,转移曲线实时绘制,单臂/双臂/推挽三种模式 |
| IQ 调制器 | QPSK/16QAM/64QAM 星座图,I/Q/P 全分量调节,发送/接收端对比分析 |
| 偏振复用 | 庞加莱球与偏振椭圆,斯托克斯参数实时计算 |
| 光接收器 | AWGN 信道、BER vs SNR 曲线、EVM 计算 |
- 前端框架:React 19 + TypeScript
- 构建工具:Vite 8
- 状态管理:Zustand 5
- 样式方案:Tailwind CSS v4
- 数学渲染:KaTeX
- 路由管理:React Router v7 (HashRouter)
- 可视化:Canvas 2D + requestAnimationFrame
- 图标库:Lucide React
# 安装依赖
pnpm install
# 开发模式
pnpm dev
# 代码检查
pnpm lint
# 类型检查
pnpm check
# 构建生产版本
pnpm build
# 预览生产版本
pnpm preview项目通过 GitHub Actions 自动部署到 GitHub Pages,详见 .github/workflows/deploy.yml。