沿“ bresenham”平滑插值线 [英] smooth color interpolation along a "bresenham" line

问题描述

我正在尝试沿直线插值颜色，以便在给定两个点及其各自的RGB值的情况下，可以绘制具有平滑颜色渐变的直线。现在，我可以使用Bresenham的线条算法绘制线条，但是不确定如何在两个端点之间插入颜色。以下是drawLine（）函数的一部分，该函数适用于斜率小于1的所有线。

I am trying to interpolate color along a line so that, given two points and their respective RGB values, I can draw a line with a smooth color gradient. Using Bresenham's Line Algorithm, I can now draw lines, but am not sure how to begin interpolating colors between the two end points. The following is part of the drawLine() function that works for all line whose slope are less than 1.

    int x_start = p1.x, x_end = p2.x, y_start =p1.y, y_end = p2.y;
    int dx = Math.abs(x_end-x_start), dy = Math.abs(y_end-y_start);

    int x = x_start, y = y_start;       
    int step_x = x_start < x_end ? 1:-1;
    int step_y = y_start < y_end ? 1:-1;

    int rStart = (int)(255.0f * p1.c.r), rEnd = (int)(255.0f * p2.c.r);
    int gStart = (int)(255.0f * p1.c.g), gEnd = (int)(255.0f * p2.c.g);
    int bStart = (int)(255.0f * p1.c.b), bEnd = (int)(255.0f * p2.c.b);

    int xCount = 0;


//for slope < 1
        int p = 2*dy-dx;
        int twoDy = 2*dy, twoDyMinusDx = 2*(dy-dx);         
        int xCount = 0;

        // draw the first point
        Point2D start = new Point2D(x, y, new ColorType(p1.c.r, p1.c.g, p1.c.b));           
        drawPoint(buff, start);

        float pColor = xCount / Math.abs((x_end - x_start));
        System.out.println(x_end + "  " + x_start);

        while(x != x_end){
            x+= step_x;
            xCount++;
            if(p<0){
                p+= twoDy;
            }
            else{
                y += step_y;
                p += twoDyMinusDx;
            }

            Point2D draw_line = new Point2D(x, y, new ColorType(p1.c.r*(1-pColor)+p2.c.r*pColor,p1.c.g*(1-pColor)+p2.c.g*pColor,p1.c.b*(1-pColor)+p2.c.b*pColor));
            System.out.println(pColor);
            drawPoint(buff,draw_line );
        }

所以我在想的是，就像画线一样，需要某种决策参数p来确定何时更改RGB值。我正在考虑以 x递增的方式进行操作，查看每个rgb值并决定是否要操作它们。

So what I'm thinking is that, just like drawing lines, I also need some sort of decision parameter p to determine when to change the RGB values. I am thinking of something along lines of as x increments, look at each rgb value and decide if I want to manipualte them or not.

我初始化了rStart和rEnd（对于g和b等等），但是不知道从哪里开始。

I initialized rStart and rEnd(and so on for g and b) but have no idea where to start. any kind of help or suggestions would be greatly appreciated!

编辑：感谢@Compass的出色建议！现在，在尝试实施该策略时遇到了另一个问题，几乎可以肯定，这是一个简单的错误。我现在看不到它。由于某种原因，我的 pColor 总是返回0，我不确定为什么。我运行了一些打印语句以确保xCount确实在增加，所以我不确定还有什么可能使该变量始终为0。

thanks @Compass for the great suggestion ! Now I've ran into another while trying to implementing that strategy, and I am almost certain it's an easy bug. I just can't see it right now. For some reason my pColor always return 0, I am not sure why. I ran some print statements to make sure xCount is indeed increasing, so I am not sure what else might've made this variable always 0.

推荐答案

我记得我在学习GUI时想出了这个办法！我将为您解释基本概念。

I remember figuring this out way back when I was learning GUI! I'll explain the basic concepts for you.

让我们说我们有两种颜色，
RGB（A，B，C）
和
RGB（X，Y，Z）
为简单起见。

Let's say we have two colors, RGB(A,B,C) and RGB(X,Y,Z) for simplicity.

如果我们知道位置百分比（我们将其称为P，沿行开始浮动0，在末尾浮动1.0），我们可以使用以下方法计算颜色：

If we know the position percentage-wise (we'll call this P, a float 0 for beginning, 1.0 at end) along the line, we can calculate what color should be there using the following:

Resultant Color = RGB(A*(1-P)+X*P,B*(1-P)+Y*P,C*(1-P)+Z*P)

换句话说，您将沿线的各个RGB值平均。

In other words, you average out the individual RGB values along the line.

这篇关于沿“ bresenham”平滑插值线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！