3

我已经从这里实现了小林吴圆算法:https ://create.stephan-brumme.com/antialiased-circle/ in c++:

float radiusX = endRadius;
float radiusY = endRadius;
float radiusX2 = radiusX * radiusX;
float radiusY2 = radiusY * radiusY;

float maxTransparency = 127;

float quarter = roundf(radiusX2 / sqrtf(radiusX2 + radiusY2));
for(float _x = 0; _x <= quarter; _x++) {
    float _y = radiusY * sqrtf(1 - _x * _x / radiusX2);
    float error = _y - floorf(_y);

    float transparency = roundf(error * maxTransparency);
    int alpha = transparency;
    int alpha2 = maxTransparency - transparency;

    setPixel4(x, y, _x, floorf(_y), r, g, b, alpha, data, areasData, false);
    setPixel4(x, y, _x, floorf(_y) - 1, r, g, b, alpha2, data, areasData, false);
}

quarter = roundf(radiusY2 / sqrtf(radiusX2 + radiusY2));
for(float _y = 0; _y <= quarter; _y++) {
    float _x = radiusX * sqrtf(1 - _y * _y / radiusY2);
    float error = _x - floorf(_x);

    float transparency = roundf(error * maxTransparency);
    int alpha = transparency;
    int alpha2 = maxTransparency - transparency;

    setPixel4(x, y, floorf(_x), _y, r, g, b, alpha, data, areasData, false);
    setPixel4(x, y, floorf(_x) - 1, _y, r, g, b, alpha2, data, areasData, false);
}

x, y 是圆心的坐标。

在我看来,它看起来不错:

在此处输入图像描述

但是,我需要填充圆圈。也许我错了,但我开发了一个简单的算法:从 1 迭代到半径,然后画一个圆。它看起来像这样:

在此处输入图像描述

奇怪的。所以,为了解决这个问题,我还将透明度设置为最大,直到我到达最后一个半径(所以它是一个外圆):

在此处输入图像描述

如您所见,外层和其他层之间存在奇怪的孔。我试过制作两个外层和类似的东西,但没有得到正确的结果。

这是代码的最终版本:

for(int cradius = startRadius; cradius <= endRadius; cradius++) {
    bool last = cradius == endRadius;

    float radiusX = cradius;
    float radiusY = cradius;
    float radiusX2 = radiusX * radiusX;
    float radiusY2 = radiusY * radiusY;

    float maxTransparency = 127;

    float quarter = roundf(radiusX2 / sqrtf(radiusX2 + radiusY2));
    for(float _x = 0; _x <= quarter; _x++) {
        float _y = radiusY * sqrtf(1 - _x * _x / radiusX2);
        float error = _y - floorf(_y);

        float transparency = roundf(error * maxTransparency);
        int alpha = transparency;
        int alpha2 = maxTransparency - transparency;

        if(!last) {
            alpha = maxTransparency;
            alpha2 = maxTransparency;
        }

        setPixel4(x, y, _x, floorf(_y), r, g, b, alpha, data, areasData, false);
        setPixel4(x, y, _x, floorf(_y) - 1, r, g, b, alpha2, data, areasData, false);
    }

    quarter = roundf(radiusY2 / sqrtf(radiusX2 + radiusY2));
    for(float _y = 0; _y <= quarter; _y++) {
        float _x = radiusX * sqrtf(1 - _y * _y / radiusY2);
        float error = _x - floorf(_x);

        float transparency = roundf(error * maxTransparency);
        int alpha = transparency;
        int alpha2 = maxTransparency - transparency;

        if(!last) {
            alpha = maxTransparency;
            alpha2 = maxTransparency;
        }

        setPixel4(x, y, floorf(_x), _y, r, g, b, alpha, data, areasData, false);
        setPixel4(x, y, floorf(_x) - 1, _y, r, g, b, alpha2, data, areasData, false);
    }
}

我怎样才能解决这个问题?

编辑:

因为我不能使用洪水填充来填充圆圈(我绘制的区域可能不是单色背景,我需要混合这些颜色)我已经实现了将点与线连接起来的简单方法:

我在 setPixel4 方法中添加了 2 个 drawLine 调用:

void setPixel4(int x, int y, int deltaX, int deltaY, int r, int g, int b, int a, unsigned char* data, unsigned char* areasData, bool blendColor) {
    drawLine(x - deltaX, y - deltaY, x + deltaX, y + deltaY, r, g, b, 127, data, areasData); //maxTransparency
    drawLine(x + deltaX, y - deltaY, x - deltaX, y + deltaY, r, g, b, 127, data, areasData); //maxTransparency

    setPixelWithCheckingArea(x + deltaX, y + deltaY, r, g, b, a, data, areasData, blendColor);
    setPixelWithCheckingArea(x - deltaX, y + deltaY, r, g, b, a, data, areasData, blendColor);
    setPixelWithCheckingArea(x + deltaX, y - deltaY, r, g, b, a, data, areasData, blendColor);
    setPixelWithCheckingArea(x - deltaX, y - deltaY, r, g, b, a, data, areasData, blendColor);
}

它看起来与第三张图片完全相同。我认为里面的这些白色像素是由外圈(来自小林吴算法)本身引起的。

编辑2:

感谢@JaMiT,我改进了我的代码,它适用于一个圈子,但是当我有更多的相互重叠时会失败。首先,新代码:

void drawFilledCircle(int x, int y, int startRadius, int endRadius, int r, int g, int b, int a, unsigned char* data, unsigned char* areasData, int startAngle, int endAngle, bool blendColor) {
    assert(startAngle <= endAngle);
    assert(startRadius <= endRadius);

    dfBufferCounter = 0;

    for(int i = 0; i < DRAW_FILLED_CIRCLE_BUFFER_SIZE; i++) {
        drawFilledCircleBuffer[i] = -1;
    }

    for(int cradius = endRadius; cradius >= startRadius; cradius--) {
        bool last = cradius == endRadius;
        bool first = cradius == startRadius && cradius != 0;

        float radiusX = cradius;
        float radiusY = cradius;
        float radiusX2 = radiusX * radiusX;
        float radiusY2 = radiusY * radiusY;

        float maxTransparency = 127;

        float quarter = roundf(radiusX2 / sqrtf(radiusX2 + radiusY2));
        for(float _x = 0; _x <= quarter; _x++) {
            float _y = radiusY * sqrtf(1 - _x * _x / radiusX2);
            float error = _y - floorf(_y);

            float transparency = roundf(error * maxTransparency);
            int alpha = last ? transparency : maxTransparency;
            int alpha2 = first ? maxTransparency - transparency : maxTransparency;

            setPixel4(x, y, _x, floorf(_y), r, g, b, alpha, cradius, endRadius, data, areasData, blendColor);
            setPixel4(x, y, _x, floorf(_y) - 1, r, g, b, alpha2, cradius, endRadius, data, areasData, blendColor);
        }

        quarter = roundf(radiusY2 / sqrtf(radiusX2 + radiusY2));
        for(float _y = 0; _y <= quarter; _y++) {
            float _x = radiusX * sqrtf(1 - _y * _y / radiusY2);
            float error = _x - floorf(_x);

            float transparency = roundf(error * maxTransparency);
            int alpha = last ? transparency : maxTransparency;
            int alpha2 = first ? maxTransparency - transparency : maxTransparency;

            setPixel4(x, y, floorf(_x), _y, r, g, b, alpha, cradius, endRadius, data, areasData, blendColor);
            setPixel4(x, y, floorf(_x) - 1, _y, r, g, b, alpha2, cradius, endRadius, data, areasData, blendColor);
        }
    }
}

如果没有 setPixel4 中的 drawLine 调用,它看起来像这样:

在此处输入图像描述

我改进了 setPixel4 方法以避免再次重绘相同的像素:

void setPixel4(int x, int y, int deltaX, int deltaY, int r, int g, int b, int a, int radius, int maxRadius, unsigned char* data, unsigned char* areasData, bool blendColor) {

    for(int j = 0; j < 4; j++) {

        int px, py;
        if(j == 0) {
            px = x + deltaX;
            py = y + deltaY;
        } else if(j == 1) {
            px = x - deltaX;
            py = y + deltaY;
        } else if(j == 2) {
            px = x + deltaX;
            py = y - deltaY;
        } else if(j == 3) {
            px = x - deltaX;
            py = y - deltaY;
        }

        int index = (px + (img->getHeight() - py - 1) * img->getWidth()) * 4;

        bool alreadyInBuffer = false;
        for(int i = 0; i < dfBufferCounter; i++) {
            if(i >= DRAW_FILLED_CIRCLE_BUFFER_SIZE) break;
            if(drawFilledCircleBuffer[i] == index) {
                alreadyInBuffer = true;
                break;
            }
        }

        if(!alreadyInBuffer) {
            if(dfBufferCounter < DRAW_FILLED_CIRCLE_BUFFER_SIZE) {
                drawFilledCircleBuffer[dfBufferCounter++] = index;
            }

            setPixelWithCheckingArea(px, py, r, g, b, a, data, areasData, blendColor);
        }
    }

}

然后,最后:

在此处输入图像描述

这几乎是完美的。然而,我挣扎了很多时间来摆脱这个白色的轮廓,但我做不到。

4

3 回答 3

3

因为您将圆离散化,所以必然会丢失一些像素。您获得的图片显示了众所周知的莫尔效应。

最好的解决方案是使用任何洪水填充算法或合成将在相同水平线(或垂直线,如果您愿意)上的圆点之间画线的简单算法。

于 2019-02-08T14:54:46.860 回答
2

您应该只绘制一个外圆,从左到右像素侧通过实心水平简单线连接。

[在此处输入图像描述] 1

于 2019-10-18T11:04:22.150 回答
2

想想你正在做什么来获得第三张图像(在圆周内有“奇怪的洞”的那张)。你画了内盘,你想在它周围画一个圆圈,让它稍微大一点。好主意。(你的微积分老师应该批准。)

但是,您不是简单地围绕它画一个圆圈;你在它周围画一个抗锯齿的圆圈。这意味着什么?这意味着你不是简单地画一个点,而是画两个,用不同的透明度来欺骗眼睛,让他们认为它只是一个。其中一个点(内部点)将覆盖您已经绘制的磁盘点。

当外点更透明时,除了可能有点模糊之外没有问题。但是,当内部点更透明时,您会出现这种奇怪的行为,即磁盘开始时大部分是不透明的,然后变得更加透明,然后又恢复到完全不透明。你从磁盘上取了一个完全不透明的点,使它大部分是透明的。你的眼睛把它解释为一个洞。

那么如何解决这个问题呢?

1)只要您的磁盘应该是均匀着色的(考虑到透明度),如果您反转外环,您的最后一次尝试应该可以工作 - 从最大半径变为零。因为只有最外层的圆圈被赋予抗锯齿,所以只有这个反向循环的第一次迭代会用更透明的像素覆盖一个像素。在那个阶段没有什么可以覆盖的。

或者

2)在您设置的两个地方alpha2,将其设置为maxTransparency。这是内部像素的透明度,您不希望对内部边缘进行抗锯齿处理。继续并在任一方向上循环半径,将您的磁盘构建成圆形。不绘制最外圈时,继续将两个透明度设置为最大。这种方法的优点是可以在磁盘中间打一个洞;startRadius不必为零。当你在startRadius(并且startRadius不为零)时,alpha2根据反锯齿算法设置,但设置alphamaxTransparency.

所以你的 alpha 设置逻辑看起来像

    bool first = cradius == startRadius  &&  cRadius != 0; // Done earlier
    int alpha = last ? transparency : maxTransparency;
    int alpha2 = first ? maxTransparency - transparency : maxTransparency;

编辑:想想看,如果是零,就会cRadius被零除。由于您显然已经考虑到了这一点,您应该能够将“第一”的概念调整为“最内圈,我们实际上正在留下一个洞”。

或者

3)您可以按照建议画线,但有一些事情需要调整以尽量减少伪影。首先,删除每对中的第二个调用setPixel4;我们将用线条覆盖这种情况。这消除了需要alpha2(无论如何这是造成漏洞的原因)。其次,尝试画一个盒子(四条线)而不是两条平行线。使用这种算法,一半的绘图基于水平线,一半基于垂直线。通过一直绘制两者,您可以覆盖您的基础。第三,如果您仍然看到伪影,请尝试在第一个框内绘制第二个框。

于 2019-02-11T18:55:38.037 回答