Drawing different colored shapes in a path (HTML5 Canvas / Javascript)

Question

I\'m trying to draw multiple circle arcs filled with different colors

        //-------------- draw
        ctx.beginPath();
        ctx.fillStyle = \"black\";
          


        

Answer 1

Close the path and then reopen it.

ctx.closePath();
ctx.beginPath();

jsFiddle.

...between the arc drawing code.