在Javascript中将progressbar步骤转换为像素

我使用HTML5画布元素在javascript中实现了一个简单的progressbar。progressbar应该能够显示100个步骤。(0-100%) progressbar应该能够具有可变大小，可以由用户设置下注。 所以，每一步我都画一个矩形

例如： -progressbar画布的宽度为100px。 -每一步我都画一个新的一像素宽的块

问题是： -progressbar画布的宽度为550px。 -步进块大小为5.5px（550/步） -我画不出半像素。如果我使用Math.floor或Math.Round，progressbar将不会100%填写完整，否则将“填写过量”

我怎样才能解决这个问题

var percWidth = Math.round(canvas.width / 100);

for (var i = 0; i<= percentage; i++)
{

var r,g,b;
if (i <= 50)
{
   r = 255;
   g = Math.round((255*i)/50);
   b = 0;
}
else
{
   r = Math.round((255*(100-i))/50);
   g = 255;
   b = 0
 }

 context.fillStyle = "rgb("+r+", "+g+", "+b+")";
 context.fillRect((i*percWidth), 0, (1*percWidth), canvas.height);

}

var percWidth=Math.round（canvas.width/100）；
对于（var i=0；i仅对最终结果进行四舍五入：

context.fillRect(Math.round(i*canvas.width / 100), 0, (percWidth), canvas.height);

我知道这并不直接适用于你的问题，但是
是一个合适的替代品吗？
使用
.ceil（）
代替。对于任何分数值，它都会四舍五入到下一个整数。但是ceil（）不会四舍五入到6px吗？在100%时，它会填充600px（在92%时，条形图将完全填充）.抱歉，但在我的情况下，这也像是.round（）。它“填满”了酒吧。科内拉克的答案很好。不过，谢谢！我必须等待4分钟，直到我可以接受你的答案。（不要问我为什么…）还有前面的哪个问题？关于WM6.5的问题？它仍然没有解决。。）备注：如果您想查看progressbar-请访问：