# agenda

**Repository Path**: 12581/agenda

## Basic Information

- **Project Name**: agenda
- **Description**: 会议议程
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-01-17
- **Last Updated**: 2026-01-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 图片识别转HTML工具

## 功能介绍

该工具使用OCR技术识别图片中的文字内容，并将其转换为美观的HTML格式。支持中英文识别，生成的HTML页面包含以下特色功能：

- 🎨 现代化的渐变设计和响应式布局
- 🌓 支持明暗主题切换
- 📍 活动地点地图导航（支持高德、百度、腾讯地图）
- 📱 适配移动端和桌面端
- 📊 结构化的内容组织

## 技术栈

- **OCR引擎**：Tesseract.js
- **开发语言**：JavaScript
- **输出格式**：HTML5 + CSS3
- **响应式设计**：CSS Grid + Flexbox

## 快速开始

### 安装依赖

```bash
npm install tesseract.js
```

### 使用方法

1. 将需要识别的图片放入项目根目录
2. 修改`ocr-convert.js`中的图片文件名（默认为`416f01198014de7a8c3a2ff32642021d.jpg`）
3. 运行脚本：

```bash
node ocr-convert.js
```

4. 生成的HTML文件将保存在同一目录下

## 项目结构

```
├── 416f01198014de7a8c3a2ff32642021d.jpg  # 示例图片
├── 416f01198014de7a8c3a2ff32642021d.html  # 生成的HTML文件
├── chi_sim.traineddata  # 中文语言包
├── eng.traineddata  # 英文语言包
├── ocr-convert.js  # 主程序脚本
├── package-lock.json  # 依赖锁定文件
├── package.json  # 项目配置文件
├── qrcode.png  # 示例二维码图片
└── README.md  # 项目说明文档
```

## 生成的HTML特性

### 视觉设计
- 现代化的渐变背景和卡片式布局
- 精美的头部横幅和标题设计
- 柔和的色彩方案，以蓝色为主色调
- 阴影和圆角效果，提升视觉层次感

### 内容结构化
- 清晰的章节划分：活动介绍、活动亮点、活动流程、活动信息和活动愿景
- 时间线样式展示活动流程
- 信息卡片布局展示关键活动信息
- 突出显示产品核心亮点

### 交互功能
- 主题切换按钮，支持明暗主题
- 地图导航链接，支持多种地图服务
- 响应式设计，适配不同屏幕尺寸
- 平滑过渡效果

## 主题切换

HTML页面右上角提供了主题切换按钮，点击可以在明暗主题之间切换：

- **浅色主题**：适合明亮环境，使用白色背景和深色文字
- **深色主题**：适合夜间阅读，使用深色背景和浅色文字

## 地图导航

活动地点部分提供了三大主流地图服务的导航链接：

- 🗺️ 高德地图
- 🗺️ 百度地图
- 🗺️ 腾讯地图

点击对应的地图按钮，即可在新窗口打开地图应用，直接导航到活动地点。

## 响应式设计

- **桌面端**：地图按钮水平排列，二维码正常显示
- **移动端**：地图按钮垂直排列，二维码尺寸自适应

## 自定义配置

### 修改识别语言

在`ocr-convert.js`中修改语言配置：

```javascript
const worker = await createWorker('chi_sim+eng'); // 中英文识别
```

### 修改HTML模板

在`ocr-convert.js`中可以自定义HTML模板，调整页面结构和样式。

## 注意事项

1. 首次运行时，Tesseract.js会下载语言包，可能需要一些时间
2. 识别效果取决于图片质量和文字清晰度
3. 建议使用分辨率较高的图片，以获得更好的识别效果
4. 对于复杂布局的图片，可能需要手动调整生成的HTML结构

## 示例图片

项目中包含一张示例图片`416f01198014de7a8c3a2ff32642021d.jpg`，展示了TRAE Friends @ 厦门活动的海报。

## 许可证

MIT License

## 贡献

欢迎提交Issue和Pull Request，共同改进这个工具！