将图像读取为线条的算法(然后得到它们的结果)？

Question

是否有算法从像素中获取图像的线条笔划(忽略曲线,圆圈等,所有内容将被视为线条,但仍然类似于矢量)？然后得到它们的结果,就像一个Array？

这就是它的基本工作方式

这样,每行像素将被读作1条水平线,我也想处理垂直线; 但是如果有一个圆形的脂肪线需要超过1行

它将被视为一条线.它的线宽与它所具有的像素高度相同.

例如,假设我们有一个包含(红色,绿色,蓝色,alpha)格式(JavaScript)像素行的数组:

/* formatted ImageData().data */
[
    new Uint8Array([
        /* first pixel */
        255, 0, 0, 255,
        /* second pixel */
        255, 0, 0, 255
    ]),

    new Uint8Array([
        /* first pixel */
        0, 0, 0, 0,
        /* second pixel */
        0, 0, 0, 0
    ])
]

这将是2x2px图像数据,具有直的水平红线.所以,从这个数组中,我想得到一个包含行数据的数组,如:

[
    // x, y: start point
    // tx, ty: end point
    // w: line width

    // the straight horizontal red line of 1 pixel
    { x: 0, y: 0, tx: 2, ty: 0, w: 1, rgba: [255, 0, 0, 255] }
]

注意:我想处理抗锯齿.

这是我以上述格式读取像素的功能:

var getImagePixels = function(img){
    var canvas = document.createElement('canvas'),
        ctx = canvas.getContext('2d');

    canvas.width = img.width;
    canvas.height = img.height;

    ctx.drawImage(img, 0, 0);

    var imgData = ctx.getImageData(0, 0, img.width, img.height).data;
    var nImgData = [];
    var offWidth = img.width * 4;

    var dataRow = (nImgData[0] = new Uint8Array(offWidth));

    for (var b = 0, i = 0; b++ < img.height;) {
        nImgData[b] = new Uint8Array(offWidth);

        for (var arrI = 0, len = i + offWidth; i < len; i += 4, arrI += 4) {
            nImgData[b][arrI] = imgData[i];
            nImgData[b][arrI + 1] = imgData[i + 1];
            nImgData[b][arrI + 2] = imgData[i + 2];
            nImgData[b][arrI + 3] = imgData[i + 3];
        }
    }

    return nImgData;
};

Answer 1

您可以使用霍夫变换找到所有线。它只会找到直线，不会找到曲线或圆。您可能需要在查找线条之前运行边缘检测。这是示例：

在这里你可以找到 opencv 的实现示例。