canvas = document.getElementById(‘canvas’);
ctx = canvas.getContext(«2d»);

var num1 = 40;
var cx = 200;
var cy = 200;
var radius = 100;
var startangle = 0;
var endangle = startangle+(Math.PI*2*num1)/100;

ctx.beginPath();
ctx.strokeStyle = «red»;
ctx.lineWidth = 30;
ctx.arc(cx,cy,radius,startangle,endangle);
ctx.stroke();

var num2 = 100-num1;
startangle = endangle;
endangle = startangle+(Math.PI*2*num2)/100;

ctx.beginPath();
ctx.strokeStyle = «green»;
ctx.lineWidth = 30;
ctx.arc(cx,cy,radius,startangle,endangle);
ctx.stroke();