独立项目在线图像标注webapp

此篇想法总访问 34 次,今日访问 1 次。

CCO-Label基于名为LabelMe图像标注软件开发,该软件由Python开发,帅华君使用前端技术栈(主要应用Canvas技术),并对用户标注界面交互作合理改进。

功能划分

使用前端技术栈完成的界面是这样的,下方是功能划分。

图片源自Chrome截图

功能优化

减少操作

好的设计就是尽量不设计,好的交互就是尽量不交互。

LabelMe这款工具,需要频繁使用左右手控制键盘和鼠标完成动作,优化后,希望尽量减少多余的交互。

  • 自动闭合:在LabelMe中创建一块多边形,如果不闭合上一个多边形,是无法开始下一个多边形的绘制的。优化后,起始点坐标就是结束点坐标,用户只需绘制起始点和结束点之间的点击即可,使用鼠标右键结束绘制,如此保证绘制多边形的动作仅用鼠标即可。

可扩展

  • 附加信息:LabelMe的限制在于输出的JSON文件中的内容受限于工具本身,想要为每一个多边形标注附加信息,可是LabelMe没有提供更多的字段保存这些信息,只有一个可以设置的"label"字段。优化后,JSON文件的格式完全可控,包括为多边形标注附加任意信息,比如颜色,人工识别结果,序号信息等等。

从需求到工具

将图像中的全部手写体标注出来,最终生成一个个包含标注点的JSON文件,下方是LabelMe生成的JSON文件的部分内容。

{
  "imagePath": "20181211204835028.jpg",
  shapes: [
    {
      "shape_type": "polygon",
      "points": [
        [119, 182], [117,206],  [169,206], [173,183]
      ],
      "label": "1"
    }
  ]
}

机器学习组的童鞋将JSON文件中的一个个标注的手写体坐标区域与源图像中的位置一一对应,通过一系列复杂的变换算法,帮助机器学习以建立更完善的用于识别手写体的模型。

提取LabelMe的主要功能,保留关键的,去除非必要的,并优化可扩展的。

发布日期 » 2019年2月21日 周四
原创声明 » 请勿复制转载,谢谢配合。
Airglass.js核心库
JavaScript核心概念
硬件编程、Arduino
文档翻译计划
微信开发
前端脚手架
运维
可视化
生活自有“道”理
视觉设计、用户体验
陈帅华的微信二维码