Как мы можем сделать графики в стиле xkcd?

Подумайте о том, что произойдет, если у вас есть JPG, который is 32x32 (он имеет ровно 1024 общих пикселя), но укажите через CSS, чтобы он отображался как width:800px; height:16px. То же самое относится к HTML Canvas:

• Атрибуты width и height самого элемента canvas определяют, сколько пикселей вы можете нарисовать. Если вы не укажете высоту и ширину элемента canvas, тогда для спецификаций : "атрибут width по умолчанию равен 300, а атрибут height по умолчанию - 150."
• Свойства CSS width и height CSS определяют размер, который элемент отображает на экране. Если размеры CSS не установлены, внутренний размер элемента используется для макета.

Если вы укажете в CSS разный размер, чем фактические размеры холста, его нужно растянуть и сжатый браузером по мере необходимости для отображения. Вы можете увидеть пример этого здесь: http://jsfiddle.net/9bheb/5/