destination-out globalCompositeOperation isn't quite what I expect

Question

I'm trying to make a radial progress view. The second arc in the canvas is supposed to clear just a small part of the canvas, but it clears it all out.

I used:

this.ctx.globalCompositeOperation = 'destination-out';

check out this fiddle:

http://jsfiddle.net/8QfFh/

Answer 1

You have an extra call to setValue() at the beginning which sets the initial composite operation. Just save the context and pop it back.