0

I have the starting (x1, y1) and end (x2, y2), as well as their colours stored in RGBA.

I need to do draw a gradient filled line between these two points, and for each point along the line, I can get the current (x, y) positions as it's in a incrementing while loop.

Start and End colour is available as point1.color & point2.color.

I then draw a point by using DrawPoint(Vector(x, y)) and setting the color with SetColor(RGBA) before it goes through the loop again.

GilfoyMayhew
  • 1
  • 4
  • 2
    Do you know how linear interpolation works? – Jongware Oct 22 '16 at 13:37
  • 1
    Did you try anything already? Also what particular drawing library do you use? That's not standard c++ stuff. – πάντα ῥεῖ Oct 22 '16 at 13:37
  • I have a rough idea how Linear Interpolation works, but I am still learning. As for the library, it is one provided to me. I haven't tried anything with success, but again, I am new to C++. – GilfoyMayhew Oct 22 '16 at 13:40
  • @GilfoyMayhew It's very unprobable that your problem is about using c++ in 1st place. – πάντα ῥεῖ Oct 22 '16 at 13:42
  • I know that I am to fetch the x,y point of the current point, then use this to select an RGB color between the start and end colors – GilfoyMayhew Oct 22 '16 at 13:43
  • Color interpolation reduces to interpolating the individual values that specify the color. Depending on which color specification scheme you use you'll get slightly different results. Just start with the scheme used by your graphics library (probably RGB), and see if that works out good enough. – Cheers and hth. - Alf Oct 22 '16 at 13:47
  • Thank you. How would I do this programmatically? – GilfoyMayhew Oct 22 '16 at 13:54
  • Just posted an answer that may be useful for the color interpolation part: http://stackoverflow.com/questions/40132553/is-it-possible-to-change-the-color-of-a-qsliders-handle-according-to-its-positi/40185037#40185037 – dtech Oct 22 '16 at 14:03

1 Answers1

3

The number of individual points that your existing code (that you mentioned in your question) draws for this line must be:

l=max(abs(x2-x1), abs(y2-y1))+1

That is, if the line is mostly oriented vertically, there should be a point drawn in every row. If its mostly oriented horizontally, there should be a point drawn in every column. So we can derive the total number of individual points drawn, l, as simply the maximum difference between the starting and the ending x/y coordinates. This is what your existing code should be doing.

So, you know in advance that you're going to be drawing l points. This now becomes a simple linear interpolation between each individual r, g, b and a component. If "R1" is the R component at (x1, y1), and "R2" is the R component at (x2, y2): then when drawing your ith point, with i starting at 0 for (x1, y1), and reaching l at (x2, y2), the linearly-interpolated R is simply:

R1+i/l*(R2-R1)

So, when i=0 this is R1, and when i=l this is R2. You must compute this linear interpolation: either by using floating point math; or by doing integer multiplication first, then integer division (presuming your integer precision is sufficient to avoid overflow during multiplication).

Lather, rinse, and repeat the same process for the G, B, and A components.

Sam Varshavchik
  • 114,536
  • 5
  • 94
  • 148