简单，纯前端实现的图片单分类和目标检测数据标注工具。

Code & Docs from Claude.

• 可以选择包含图片的文件夹
• 可以设置分类标签（格式为：标签号 标签名）
• 点击"开始标注"按钮进入标注界面

• 只读取当前路径下的图片，不包括子路径中的图片
• 支持常见图片格式：jpg、jpeg、png、gif、bmp、webp

• 每次显示一张图片
• 显示分类标签按钮
• 点击标签按钮或按下对应数字键可以为图片标注
• 标注后自动跳转到下一张图片
• 提供进度条显示标注进度
• 可以使用"上一张"和"下一张"按钮或键盘箭头键导航

• 点击"导出标注结果"按钮可以将标注结果导出为JSON文件
• JSON文件包含标签定义和每张图片的标注结果

• 数字键：快速选择对应标签号的标签
• 左右箭头键或A/D键：导航到上一张/下一张图片

• 打开HTML文件
• 点击"选择图片文件夹"选择包含图片的文件夹
• 在文本框中输入分类标签
• 点击"开始标注"按钮
• 通过点击标签按钮或按数字键为图片标注
• 标注完成后点击"导出标注结果"按钮保存标注数据

这个系统不需要任何后端支持，完全在浏览器中运行，便于使用和部署。

目标检测标注系统是一个基于Web的工具，用于对图像进行目标检测标注。该系统允许用户加载多张图片，通过绘制矩形框对图像中的目标进行标注，并将标注数据以YOLO格式保存。系统界面简洁直观，操作流程清晰，适合各类目标检测数据集的制作。

• 支持批量加载和浏览图片
• 自定义标注类别管理
• 矩形框标注工具
• 标注数据实时可视化
• 支持YOLO格式的标注数据导入导出
• 友好的用户界面和操作反馈

系统界面主要分为以下几个部分：

1. 顶部工具栏：包含系统标题和保存/加载标注数据的按钮
2. 图像显示区：显示当前图像及其标注框
3. 侧边栏：包含图片选择、导航、类别管理和标注列表等功能
4. 状态栏：显示当前图片信息和标注数量

1. 点击侧边栏中的"选择图片文件"按钮
2. 在文件浏览器中选择一个或多个图片文件（支持常见图片格式如JPG、PNG等）
3. 系统将自动加载所选图片，并显示加载进度
4. 加载完成后，第一张图片将自动显示在图像显示区

• 使用侧边栏中的"上一张"和"下一张"按钮在加载的图片之间导航
• 当前图片位置会在按钮中间显示（如"1/10"表示当前是第1张，共10张）
• 当前图片的文件名会显示在状态栏中

系统预设了三个基本类别：person（人）、car（车）、bicycle（自行车）。用户可以根据需要添加或删除类别。

1. 点击"添加类别"按钮
2. 在弹出的对话框中输入新类别的名称
3. 点击"确认添加"按钮

1. 从下拉菜单中选择要删除的类别
2. 点击"删除类别"按钮
3. 确认删除操作（注意：删除类别将同时删除使用该类别的所有标注）

1. 从下拉菜单中选择要标注的目标类别
2. 在图像上按住鼠标左键，拖动创建矩形框
3. 松开鼠标左键完成标注
4. 新创建的标注将自动添加到标注列表中

• 点击标注列表中的条目可选中相应的标注框（选中的标注框将以红色显示）
• 点击"删除选中标注"按钮可删除当前选中的标注
• 点击"清空标注"按钮可删除当前图片的所有标注

1. 完成所需的标注工作后，点击顶部工具栏中的"保存标注"按钮
2. 系统将自动生成包含所有标注信息的JSON文件并下载到本地

1. 点击顶部工具栏中的"加载标注"按钮
2. 在文件浏览器中选择之前保存的标注数据文件（JSON格式）
3. 系统将加载标注数据并更新显示

本系统使用YOLO格式进行标注数据的存储。YOLO格式使用相对坐标表示目标位置，具体为：

[类别ID, 中心点X坐标, 中心点Y坐标, 宽度, 高度]

其中：

• 类别ID：标注目标的类别索引
• 中心点X/Y坐标：标注框中心点在图像中的相对位置（0-1之间的值）
• 宽度/高度：标注框的相对宽度和高度（0-1之间的值）

1. 标注框必须大于最小尺寸（10x10像素），过小的框将被忽略
2. 系统会自动调整标注框以确保其在图像区域内
3. 至少需要保留一个类别，不能删除所有类别
4. 建议定期保存标注数据，以免数据丢失
5. 加载大量或高分辨率图片可能需要较长时间，请耐心等待

• 直接点击标注列表中的条目可快速选中标注
• 在图像区域外释放鼠标可取消当前标注绘制
• 标注时尽量精确框选目标，确保框的边缘紧贴目标轮廓

如果您在使用过程中遇到任何问题或有改进建议，请联系系统管理员或技术支持团队。

祝您使用愉快！