如何用HTML5的canvas里面画图？

在HTML里画一些简单的图的时候，有时候我们并不需要像HighCharts这样重量级的画图库。在HTML5的canvas里面画一些简单的图并不难。

从一个最简单的例子看起：

运行代码，可以看到我们很容易在canvas里面画了一个方框：方框的起始位置是(20, 20)，宽度和高度分别是150和100。

有了这个基础，我们可以再画一个简单的柱状图（点“运行”按钮来查看运行结果）：

这样，一个简单的柱状图就画好了。

本篇的目的不是鼓励大家造轮子，而是在某些特别简单的情况下可以尝试自己画图，也是挺有意思的。