中文 | English
这是一个关于 HKUST COMP2211 (Machine Learning) 的交互式学习网站。该项目旨在通过可视化的方式帮助学生理解机器学习中的核心概念,目前项目正在持续更新中。
你可以通过以下链接体验该项目:
目前,本项目的内容主要参考了 moyunxiang/COMP2211 的学习笔记。之后会根据Desmond教授的COMP2211授课内逐步更新。
未来计划:
- 持续更新更多 COMP2211 相关的可视化模块。
- 本项目的COMP2211部分将会合并 moyunxiang/COMP2211,作为其互动补充部分。
- COMP2211部分将会以MIT协议开源,共学生们学习参考。
交互式模拟卷积核(滤波器)如何从图像中提取特征。
-
过程可视化: 实时演示
$(I * K)_{x,y}$ 运算,并排展示输入图像 ($I$ )、卷积核 ($K$ ) 和输出特征图。 - 交互式卷积核: 体验 Sobel-X/Y(边缘检测)、Laplacian(二阶导数/突变点捕捉)和 Identity 等预设卷积核,或自定义卷积核数值。
- 教学洞见: 直观理解卷积核作为局部特征过滤器如何捕捉空间模式。
本项目基于现代前端技术栈构建,注重性能与交互体验:
- 核心框架: React (v19) - 用于构建用户界面。
- 构建工具: Vite - 提供极速的开发服务器和构建体验。
- 样式方案: Tailwind CSS (v4) - 实用优先的 CSS 框架,快速构建现代 UI。
- 动画引擎: Framer Motion - 实现流畅的交互动画效果(如梯度下降追踪、矩阵变换)。
- 数学公式: KaTeX - 高性能的 LaTeX 公式渲染库。
- 国际化: react-i18next - 支持中英文一键切换。
- 图标库: Lucide React - 简洁美观的图标组件。
- 单文件构建:
vite-plugin-singlefile- 将整个应用打包为单个 HTML 文件,便于分发和部署。
-
克隆仓库:
git clone https://github.com/CharlesZhang2023/cshelper.git
-
安装依赖:
cd cshelper npm install -
启动开发服务器:
npm run dev
-
构建项目:
npm run build