What is it?

Kind of a follow on from this demo I did before as part of some text animations I did – I wanted to try and recreate the effect but with canvas drawing to make it a bit more fun and interactive.

Proved a bit more difficult than I thought it would be (and much more so than the previous CSS equivalent was), drawing on canvas with neon light-like strokes isn’t too tough, but then getting each stroke to flicker on random intervals, for a random number of flickers was an issue. In the end had to store the points for each mouse stroke on the main, initial canvas, and then paint these on to a new canvas which is layered behind the main canvas. Then, if this stroke is selected to flicker, the effect can be applied to this canvas only.

It works OK to a point, but as every stroke is a new canvas it can very quickly get bogged down if you are creating a lot of strokes. And I couldn’t get the colours to look as good as with the CSS color/text-shadow version either.