This is hard to explain but I am going to try, then I will explain it as pure mathematics.

Look at this image. enter image description here So basically this is a moving line, each frame a new segment is added and the previous frame is faded by an amount decided by fps. (There are dots to make things neat but I'm not showing them for simplicity).

So based on the FPS a number is calculated (0.05 if perfect FPS ) and as a result the previous frame gets a black plane drawn over it with an opacity of 0.05.

As you can see this causes an issue because of the segments. My solution is to give each vertex a color, however I don't know how to calculate that color. The line color is defined by HSV, and the fading is decided by RGB. Furthermore I am pretty sure fading with the transparent plane creates an exponential effect, however HSV.V works linearly.

My question is if I know on a given frame that the fading plane will have an opacity of 0.05 how can I calculate an equivalent HSV color to what the previous frame will be after fading? That way the bottom two vertices can be a darker color and interpolation can fix it.

The formula that decides the opacity of the black is as follows.

(dt / (1 / 60)) * 0.5
  • $\begingroup$ "As you can see this causes an issue because of the segments.". Could you describe what problem you are seeing? What about the picture should be different? $\endgroup$ – trichoplax May 25 '16 at 21:28
  • $\begingroup$ @Trichoplax the line has clear segments inside of it. The line should be smooth. $\endgroup$ – J.Doe May 25 '16 at 21:30
  • $\begingroup$ Do you mean that there should be no visible colour difference between the segments? $\endgroup$ – trichoplax May 25 '16 at 21:50
  • $\begingroup$ @trichoplax I just want the color to be smooth. I want the new segment to math nicely with the previous faded one. Just so that everything looks continuous in both shape and color. $\endgroup$ – J.Doe May 25 '16 at 22:22

The opacity acts linearly through the colors, i.e. it affects R G B similarily, so it should affects the value V the same way. You just want to have an intensity factor decay as $0.95^n$.

  • $\begingroup$ What does n mean? Why 0.95? $\endgroup$ – J.Doe May 25 '16 at 21:31
  • $\begingroup$ opacity 0.05 means transparency 0.95, i.e. the intensity scaling. n is the number of passes (i.e. number of times you apply a 0.05 opacity). $\endgroup$ – Fabrice NEYRET May 26 '16 at 15:52

First off you want the start of each line to have the color of an already faded line, ie rgb_color*0.95. You already figured out how to do this so I stop there.

For the HSV you are interested in the Value component only when fading towards black. Basically you should do hsv_color.value*0.95.

I typed this on phone. Please edit if you get it and may explain better.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.