CVAT 标签标注Tag Annotation模式完整指南从工作区切换到快捷键自定义【免费下载链接】cvatComputer Vision Annotation Tool (CVAT) is a leading platform for building high-quality visual datasets for vision AI. It offers open-source, cloud, and enterprise products, as well as labeling services, for image, video, and 3D annotation with AI-assisted labeling, quality assurance, team collaboration, analytics, and developer APIs.项目地址: https://gitcode.com/GitHub_Trending/cvat/cvatCVATComputer Vision Annotation Tool为图像与视频标注提供了多种交互模式其中标签标注Tag annotation模式专用于为单个帧打上语义标签Tag——例如给整帧图片标注“车辆”“行人”“晴天”等类别信息。本文将围绕 官方标签标注文档 展开结合 CVAT 前端cvat-ui的实际源码实现系统讲解该模式的启用方式、标签侧边栏的完整操作、每标签快捷键的自定义机制以及“自动跳转下一帧”“画布角落标签展示”等关键配置的底层原理帮助你把这套模式高效用于分类任务等标注场景。一、什么是标签标注模式为整帧打标签而非画框标签标注模式的核心用途是标注帧frame而不是帧内的具体对象区域。它不像矩形、多边形、关键点等形状标注那样需要在画布上拖拽绘制也不产生任何空间几何信息——标签不会以图形方式显示在画布工作区中而是以语义化的“标签块”附着在帧上。在 CVAT 中标签是一种独立的ObjectType.TAG对象类型。从前端源码可以看到标签标注模式有一个专用的工作区组件TagAnnotationWorkspace其结构由三部分组成tag-annotation-workspace.tsxCanvasLayout画布布局TagAnnotationSidebar标签专用侧边栏RemoveConfirmComponent删除确认弹窗。这与“单形状工作区Single Shape Workspace”“标准工作区Standard Workspace”等模式在架构上是对等的只是侧边栏被替换成了专门处理标签的面板。适合使用标签标注模式的典型场景包括整帧分类为每一帧标注一个类别标签如“缺陷”“正常”帧级属性描述为帧补充天气、场景、人群密度等整体属性快速筛选在视频标注中快速标记哪些帧需要重点关注或返工。二、如何进入标签标注模式在开始标注之前打开顶部面板中的下拉列表选择Tag annotation选项即可将当前工作区切换为标签标注模式。切换后对象侧边栏Objects sidebar会被替换为专门用于标签标注的面板。该面板基于TagAnnotationSidebar组件实现tag-annotation-sidebar.tsx侧边栏宽度固定为 320px并且支持折叠收起点击侧边栏边缘的箭头图标可隐藏/展开面板。一个值得注意的细节是该模式仅在任务中至少存在一个类型为 TAG 的标签时才可用。从源码逻辑看侧边栏会通过filterApplicableForType(LabelType.TAG, labels)过滤出当前任务中可用的 TAG 类型标签若没有任何 TAG 类型标签侧边栏中所有控件将被禁用并显示提示文字Cant place tag on this frame无法在此帧上放置标签若当前帧已被删除frameData.deleted同样无法添加标签。因此在创建任务/项目时需要确保标签体系里包含“标签类型”的标签在标签配置界面中为标签指定LabelType.TAG否则无法使用该模式。三、标签侧边栏面板详解切换模式后标签侧边栏从上到下依次包含以下区域对应源码TagAnnotationSidebar的 JSX 结构3.1 标签选择器与添加按钮面板顶部是Tag label:区域包含一个标签下拉选择器LabelSelector和一个Plus加号按钮从下拉列表中选择要为当前帧添加的标签点击Plus按钮即可为该帧添加标签。对应源码中的onAddTag回调tag-annotation-sidebar.tsx其执行逻辑如下检查当前帧上是否已存在相同标签frameTags.every(...)判断若不存在则先通过rememberObject记住当前选择的标签再调用createAnnotations创建新的ObjectStateobjectType: ObjectType.TAG绑定当前frameNumber若勾选了“自动跳转下一帧”则在创建成功后自动切换帧。同一标签在一帧上只能存在一次源码中的去重逻辑保证不会重复添加如果再次对同一标签调用添加操作则不会创建新对象因此不会出现一帧挂多个同名标签的情况。3.2 自动跳转下一帧面板中提供Automatically go to the next frame自动跳转到下一帧复选框。启用后每添加一个标签当前帧就会自动切换到下一帧tag-annotation-sidebar.tsx。该选项非常适合“一帧只标一个标签”的批量化流程选择标签 → 点击添加 → 自动跳帧 → 继续选择/添加无需手动切换帧可以显著提升整帧分类标注的效率。从源码看该行为由skipFrame状态控制当skipFrame为真时onAddTag在创建标签后会调用onChangeFrame通过jobInstance.frames.search查找下一帧跳过被删除的帧并在isAbleToChangeFrame校验通过后切换。3.3 为每个标签自定义快捷键侧边栏中提供Shortcuts for labels:标签快捷键区域可以为每个标签单独绑定数字快捷键shortcuts-select.tsx。实现机制如下系统预注册了10 个数字快捷键位1~9、0对应快捷键SETUP_1_TAG~SETUP_10_TAG均限定在TAG_ANNOTATION_WORKSPACE作用域内生效侧边栏会取当前任务中前 10 个标签与这 10 个快捷键位一一对应每个快捷键位旁边是一个下拉选择框你可以将任意标签绑定到任意数字键也可以选择None解除绑定绑定完成后按对应数字键即可快速为该帧添加该标签。切换式行为Toggle从onShortcutPress的实现tag-annotation-sidebar.tsx可以看到快捷键是可切换的若当前帧没有该标签 → 按下快捷键 添加该标签若当前帧已有该标签 → 按下快捷键 移除该标签。同时侧边栏底部会给出文字提示Use configured shortcuts to add a new tag. If a tag with such label is already exists on the frame, it will be removed.使用已配置的快捷键添加新标签如果该标签已存在于当前帧则会被移除。另外TagAnnotationSidebar还注册了一个默认快捷键nSWITCH_DRAW_MODE_TAG_ANNOTATION名称为 “Create a tag”按下n会为当前选中的标签创建一个标签对象其逻辑与点击Plus按钮一致tag-annotation-sidebar.tsx。所有快捷键均可在 CVAT 的快捷键设置界面中自定义绑定冲突检测逻辑见 conflict-detector.ts。3.4 删除标签除了通过数字快捷键再次按下进行移除外还可以在画布左上角的标签展示区域点击标签右上角的关闭×图标来删除标签详见下文第四节。删除操作最终通过removeObjectaction 派发到标注状态中。四、标签在画布上的展示与显隐控制标签添加成功后会显示在画布工作区的左上角。该展示由FrameTags组件负责frame-tags.tsx挂载在画布包装组件的cvat-canvas-frame-tags容器中canvas-wrapper.tsx。每个标签以彩色块的形式呈现颜色取自标签本身的颜色配置tag.label.color点击标签右上角的关闭图标即可删除该标签。此外FrameTags组件还区分了普通标签与Ground Truth 标签Ground Truth 标签会额外显示(GT)后缀便于区分参考标注与实际标注。显示/隐藏控制标签在画布上的展示可以在**设置Settings**中开启或关闭。具体位于工作区设置的Show tags on frame在帧上显示标签复选框workspace-settings.tsx其说明文案为 “Show frame tags in the corner of the workspace”在工作区角落显示帧标签。关闭该选项后标签仍然存在不影响标注数据本身只是不再显示在画布角落。五、源码视角标签对象的底层模型从数据层面看标签与形状、关键点等对象共享同一套对象状态模型只是在创建时指定objectType: ObjectType.TAGtag-annotation-sidebar.tsxnew cvat.classes.ObjectState({ objectType: ObjectType.TAG, label: labels.filter((label) label.id labelID)[0], frame: frameNumber, });这意味着标签对象同样绑定一个具体的标签Label归属于某一帧frame支持属性、评论等通用对象能力会被纳入标注保存流程通过createAnnotationsAsync持久化。同时标签对象的生命周期与普通对象一致创建时进入标注状态集合states删除时通过removeObject移除。侧边栏中的“当前帧标签列表”即由states.filter(objectType ObjectType.TAG)实时派生tag-annotation-sidebar.tsx。六、最佳实践与注意事项结合文档与源码实现使用标签标注模式时有以下几点值得留意提前规划标签体系确保任务/项目中存在TAG类型的标签否则侧边栏控件会被禁用并提示无法放置标签。善用“自动跳转下一帧”对于一帧只标一个标签的分类型任务勾选该复选框可将“选标签 → 添加 → 跳帧”合并为一条流水线显著提升效率。配置标签快捷键为高频标签绑定1~9、0数字键并按需记住“再次按下删除”的切换语义单手即可完成整帧标注。快捷键作用域标签快捷键只在标签标注工作区TAG_ANNOTATION_WORKSPACE生效不会影响其他标注模式的快捷键enums.tsx。标签不参与空间显示标签不以几何图形形式出现在画布中央仅显示在左上角角落若角落展示干扰视线可在设置中关闭Show tags on frame。Ground Truth 区分Ground Truth 标签会以(GT)后缀单独显示可用于质量校验场景。七、参考资源官方文档Annotation with tags工作区组件tag-annotation-workspace.tsx侧边栏组件tag-annotation-sidebar.tsx快捷键配置shortcuts-select.tsx画布标签展示frame-tags.tsx显隐设置workspace-settings.tsx【免费下载链接】cvatComputer Vision Annotation Tool (CVAT) is a leading platform for building high-quality visual datasets for vision AI. It offers open-source, cloud, and enterprise products, as well as labeling services, for image, video, and 3D annotation with AI-assisted labeling, quality assurance, team collaboration, analytics, and developer APIs.项目地址: https://gitcode.com/GitHub_Trending/cvat/cvat创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 CVAT 标签标注（Tag Annotation）模式完整指南：从工作区切换到快捷键自定义
CVAT 标签标注Tag Annotation模式完整指南从工作区切换到快捷键自定义【免费下载链接】cvatComputer Vision Annotation Tool (CVAT) is a leading platform for building high-quality visual datasets for vision AI. It offers open-source, cloud, and enterprise products, as well as labeling services, for image, video, and 3D annotation with AI-assisted labeling, quality assurance, team collaboration, analytics, and developer APIs.项目地址: https://gitcode.com/GitHub_Trending/cvat/cvatCVATComputer Vision Annotation Tool为图像与视频标注提供了多种交互模式其中标签标注Tag annotation模式专用于为单个帧打上语义标签Tag——例如给整帧图片标注“车辆”“行人”“晴天”等类别信息。本文将围绕 官方标签标注文档 展开结合 CVAT 前端cvat-ui的实际源码实现系统讲解该模式的启用方式、标签侧边栏的完整操作、每标签快捷键的自定义机制以及“自动跳转下一帧”“画布角落标签展示”等关键配置的底层原理帮助你把这套模式高效用于分类任务等标注场景。一、什么是标签标注模式为整帧打标签而非画框标签标注模式的核心用途是标注帧frame而不是帧内的具体对象区域。它不像矩形、多边形、关键点等形状标注那样需要在画布上拖拽绘制也不产生任何空间几何信息——标签不会以图形方式显示在画布工作区中而是以语义化的“标签块”附着在帧上。在 CVAT 中标签是一种独立的ObjectType.TAG对象类型。从前端源码可以看到标签标注模式有一个专用的工作区组件TagAnnotationWorkspace其结构由三部分组成tag-annotation-workspace.tsxCanvasLayout画布布局TagAnnotationSidebar标签专用侧边栏RemoveConfirmComponent删除确认弹窗。这与“单形状工作区Single Shape Workspace”“标准工作区Standard Workspace”等模式在架构上是对等的只是侧边栏被替换成了专门处理标签的面板。适合使用标签标注模式的典型场景包括整帧分类为每一帧标注一个类别标签如“缺陷”“正常”帧级属性描述为帧补充天气、场景、人群密度等整体属性快速筛选在视频标注中快速标记哪些帧需要重点关注或返工。二、如何进入标签标注模式在开始标注之前打开顶部面板中的下拉列表选择Tag annotation选项即可将当前工作区切换为标签标注模式。切换后对象侧边栏Objects sidebar会被替换为专门用于标签标注的面板。该面板基于TagAnnotationSidebar组件实现tag-annotation-sidebar.tsx侧边栏宽度固定为 320px并且支持折叠收起点击侧边栏边缘的箭头图标可隐藏/展开面板。一个值得注意的细节是该模式仅在任务中至少存在一个类型为 TAG 的标签时才可用。从源码逻辑看侧边栏会通过filterApplicableForType(LabelType.TAG, labels)过滤出当前任务中可用的 TAG 类型标签若没有任何 TAG 类型标签侧边栏中所有控件将被禁用并显示提示文字Cant place tag on this frame无法在此帧上放置标签若当前帧已被删除frameData.deleted同样无法添加标签。因此在创建任务/项目时需要确保标签体系里包含“标签类型”的标签在标签配置界面中为标签指定LabelType.TAG否则无法使用该模式。三、标签侧边栏面板详解切换模式后标签侧边栏从上到下依次包含以下区域对应源码TagAnnotationSidebar的 JSX 结构3.1 标签选择器与添加按钮面板顶部是Tag label:区域包含一个标签下拉选择器LabelSelector和一个Plus加号按钮从下拉列表中选择要为当前帧添加的标签点击Plus按钮即可为该帧添加标签。对应源码中的onAddTag回调tag-annotation-sidebar.tsx其执行逻辑如下检查当前帧上是否已存在相同标签frameTags.every(...)判断若不存在则先通过rememberObject记住当前选择的标签再调用createAnnotations创建新的ObjectStateobjectType: ObjectType.TAG绑定当前frameNumber若勾选了“自动跳转下一帧”则在创建成功后自动切换帧。同一标签在一帧上只能存在一次源码中的去重逻辑保证不会重复添加如果再次对同一标签调用添加操作则不会创建新对象因此不会出现一帧挂多个同名标签的情况。3.2 自动跳转下一帧面板中提供Automatically go to the next frame自动跳转到下一帧复选框。启用后每添加一个标签当前帧就会自动切换到下一帧tag-annotation-sidebar.tsx。该选项非常适合“一帧只标一个标签”的批量化流程选择标签 → 点击添加 → 自动跳帧 → 继续选择/添加无需手动切换帧可以显著提升整帧分类标注的效率。从源码看该行为由skipFrame状态控制当skipFrame为真时onAddTag在创建标签后会调用onChangeFrame通过jobInstance.frames.search查找下一帧跳过被删除的帧并在isAbleToChangeFrame校验通过后切换。3.3 为每个标签自定义快捷键侧边栏中提供Shortcuts for labels:标签快捷键区域可以为每个标签单独绑定数字快捷键shortcuts-select.tsx。实现机制如下系统预注册了10 个数字快捷键位1~9、0对应快捷键SETUP_1_TAG~SETUP_10_TAG均限定在TAG_ANNOTATION_WORKSPACE作用域内生效侧边栏会取当前任务中前 10 个标签与这 10 个快捷键位一一对应每个快捷键位旁边是一个下拉选择框你可以将任意标签绑定到任意数字键也可以选择None解除绑定绑定完成后按对应数字键即可快速为该帧添加该标签。切换式行为Toggle从onShortcutPress的实现tag-annotation-sidebar.tsx可以看到快捷键是可切换的若当前帧没有该标签 → 按下快捷键 添加该标签若当前帧已有该标签 → 按下快捷键 移除该标签。同时侧边栏底部会给出文字提示Use configured shortcuts to add a new tag. If a tag with such label is already exists on the frame, it will be removed.使用已配置的快捷键添加新标签如果该标签已存在于当前帧则会被移除。另外TagAnnotationSidebar还注册了一个默认快捷键nSWITCH_DRAW_MODE_TAG_ANNOTATION名称为 “Create a tag”按下n会为当前选中的标签创建一个标签对象其逻辑与点击Plus按钮一致tag-annotation-sidebar.tsx。所有快捷键均可在 CVAT 的快捷键设置界面中自定义绑定冲突检测逻辑见 conflict-detector.ts。3.4 删除标签除了通过数字快捷键再次按下进行移除外还可以在画布左上角的标签展示区域点击标签右上角的关闭×图标来删除标签详见下文第四节。删除操作最终通过removeObjectaction 派发到标注状态中。四、标签在画布上的展示与显隐控制标签添加成功后会显示在画布工作区的左上角。该展示由FrameTags组件负责frame-tags.tsx挂载在画布包装组件的cvat-canvas-frame-tags容器中canvas-wrapper.tsx。每个标签以彩色块的形式呈现颜色取自标签本身的颜色配置tag.label.color点击标签右上角的关闭图标即可删除该标签。此外FrameTags组件还区分了普通标签与Ground Truth 标签Ground Truth 标签会额外显示(GT)后缀便于区分参考标注与实际标注。显示/隐藏控制标签在画布上的展示可以在**设置Settings**中开启或关闭。具体位于工作区设置的Show tags on frame在帧上显示标签复选框workspace-settings.tsx其说明文案为 “Show frame tags in the corner of the workspace”在工作区角落显示帧标签。关闭该选项后标签仍然存在不影响标注数据本身只是不再显示在画布角落。五、源码视角标签对象的底层模型从数据层面看标签与形状、关键点等对象共享同一套对象状态模型只是在创建时指定objectType: ObjectType.TAGtag-annotation-sidebar.tsxnew cvat.classes.ObjectState({ objectType: ObjectType.TAG, label: labels.filter((label) label.id labelID)[0], frame: frameNumber, });这意味着标签对象同样绑定一个具体的标签Label归属于某一帧frame支持属性、评论等通用对象能力会被纳入标注保存流程通过createAnnotationsAsync持久化。同时标签对象的生命周期与普通对象一致创建时进入标注状态集合states删除时通过removeObject移除。侧边栏中的“当前帧标签列表”即由states.filter(objectType ObjectType.TAG)实时派生tag-annotation-sidebar.tsx。六、最佳实践与注意事项结合文档与源码实现使用标签标注模式时有以下几点值得留意提前规划标签体系确保任务/项目中存在TAG类型的标签否则侧边栏控件会被禁用并提示无法放置标签。善用“自动跳转下一帧”对于一帧只标一个标签的分类型任务勾选该复选框可将“选标签 → 添加 → 跳帧”合并为一条流水线显著提升效率。配置标签快捷键为高频标签绑定1~9、0数字键并按需记住“再次按下删除”的切换语义单手即可完成整帧标注。快捷键作用域标签快捷键只在标签标注工作区TAG_ANNOTATION_WORKSPACE生效不会影响其他标注模式的快捷键enums.tsx。标签不参与空间显示标签不以几何图形形式出现在画布中央仅显示在左上角角落若角落展示干扰视线可在设置中关闭Show tags on frame。Ground Truth 区分Ground Truth 标签会以(GT)后缀单独显示可用于质量校验场景。七、参考资源官方文档Annotation with tags工作区组件tag-annotation-workspace.tsx侧边栏组件tag-annotation-sidebar.tsx快捷键配置shortcuts-select.tsx画布标签展示frame-tags.tsx显隐设置workspace-settings.tsx【免费下载链接】cvatComputer Vision Annotation Tool (CVAT) is a leading platform for building high-quality visual datasets for vision AI. It offers open-source, cloud, and enterprise products, as well as labeling services, for image, video, and 3D annotation with AI-assisted labeling, quality assurance, team collaboration, analytics, and developer APIs.项目地址: https://gitcode.com/GitHub_Trending/cvat/cvat创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考