本实例的功能是，在HTML 5网页中同时绘制柱状图与折线图。本实例演示了2012年××啤酒瓶装类与罐装类两种产品的销售情况，使用折线图来体现瓶装类每个月的销售数量，使用柱状图来体现罐装类每个月的销售数量。在一个统计图中同时绘制柱状图与折线图的关键在于，在同一个<canvas>元素中绘制一个柱状图与一个折线图，然后通过属性设置使其看上去为一个统计图。
实例文件10.html的实现代码如下。
执行后的效果如图13-10所示。
图13-10 执行效果
