13.3  在网页中绘制分组柱状图

13.3 在网页中绘制分组柱状图

978-7-111-53392-4-Part04-49.jpg

本实例的功能是在水平坐标轴的一个坐标单位上绘制很多根柱子,通过柱状图演示了2012年××啤酒的销售情况。在一个月份中绘制两根柱子,一根柱子为瓶装类类在该月份的销售数量,另一根柱子为罐装类在该月份的销售数量。分别使用蓝色与绿色绘制两种不同的柱子,在图例中说明蓝色柱子表示瓶装类的销售数量,绿色柱子表示罐装类的销售数量,在每根柱子顶部绘制该柱子所代表的销售数量。实例文件3.html的实现代码如下。

978-7-111-53392-4-Part04-50.jpg

978-7-111-53392-4-Part04-51.jpg

执行后的效果如图13-3所示。

978-7-111-53392-4-Part04-52.jpg

图13-3 执行效果