组件提供画线条、多边形、像素混合功能和例子。 基本涵盖常见算法输出的数据。
yarn add ai-datasetviewer
import DatasetViewer from 'datasetviewer'
const config:DatasetViewerConfig = {...}
const viewer = new DatasetViewer(config)
viewer.init(callback)
name | type | descriptions |
---|---|---|
canvasInstance | HTMLCanvasElement | canvas标签,ref |
url | string | 展示图片地址 |
data | Array | canvas绘画的每一项数据 |
opreationsConfig | OpreationsConfig | 能否缩放拖动的控制 |
isDraw | boolean | 控制是否绘画数据 |
name | type | descriptions |
---|---|---|
type | CustomRect | polyline | CustomPolygon | 更多请查看fabric | 必填项,这是画布应该用什么工具处理数据的前提 |
label | string | 标签名 |
points | Array<{x:number, y:number}> | 多边形或者折线的坐标点 |
stroke | string | 颜色 |
fill | string | 颜色 |
rectData | [x,y,w,h] | 起点坐标,宽高 |
drawPoint | boolean | 是否需要画点 |
name | type | descriptions |
---|---|---|
zoom | boolean | 是否缩放 |
注意:如果项目比较注重性能,请注意源数据的精度,最好把浮点数去掉 简单来说,检测就是画框。单目3D也是画框,不过是多个不规则多边形的组合。 姿态检测类型的就是线段、或者折线的绘画。 分割比较特殊,需要看算法怎么输出mask数据类型。一般是用像素存储数据,看你们怎么规定约束条件。用canvas像素diff数据,混合就行。(最简单的混合就是srgb+颜色/2完事)。这一块和这个绘图组件无关,更多的是canvas操作数据问题。 分类可以忽略,直接绝对定位一个标签就行。
car_pose_detection (单目3d同理) detection (简单的画框) pose_detection 通用分割