Html5 Canvas - Fillrect() Incorrectly Draws The Rectangle

I'm building a visualization of a 24 hour period with this bar. It starts at midnight on the left, and ends at midnight on the right. The canvas width is 1440 = 24hrs * 60 minutes

Solution 1:

Check out the docs for fillRect()

fillRect(x, y, width, height)

You should use 4 instead of 544

ctx.fillRect(540, 0, 4, 60);