canvas - 画布反向绘制圆角矩形？

Question

我提前向我道歉，我得到了一些代码来绘制一个圆角矩形进度条，这很棒：

http://jsfiddle.net/P2qTq/

我需要反转矩形的绘制，但我无法终生管理它

http://jsfiddle.net/P2qTq/7/

我尝试更改绘制 4 条线和 4 个角的点，使其从左上角开始，但我把它弄得一团糟：

    var startT = 0;
    var startTR = horizLineLength;
    var startR = startTR + cornerLength;
    var startBR = startR + vertLineLength;
    var startB = startBR + cornerLength;
    var startBL = startB + horizLineLength;
    var startL = startBL + cornerLength;
    var startTL = startL + vertLineLength;

至

var startTL = 0;
var startL = startTL + cornerLength;
var startBL = startL + vertLineLength;
var startB = startBL + cornerLength;
var startBR = startB + horizLineLength;
var startR = startBR + cornerLength;
var startTR = startR + vertLineLength;
var startT = startTR = cornerLength;

谁能指出我正确的方向？

Answer 1

而不是这个：

drawPercentRect(ui.value);

做这个：

drawPercentRect(100-ui.value);