在网页上面动态生成柱形图

因为做了一个销售统计的功能、老师要求要与数据库有交互、动态生成柱形图、因为弄了很久所以决定写一写保存一些心得、免得忘了。

首先要导入一个包。Chart.bundle.jar、说起这个呢、是队友给我推荐的一个网站、超级棒、很多很多东西帮你生成好只要下载下来调用就行。(点击这个)->Bootstrap中文网

然后就是看那些实例代码再进行修改。

这个是首先输入要统计的家具名称（view）：

sale.jsp

然后就通过struts.xml找到sale的class、跳到action找到对应的控制层（contraller）

FurnitureAction.java

嗯、然后就是所谓的逻辑层（model）、连接数据库返回数据

这里是按照月份对每月卖出的家具数量进行分组。

好、跳到显示柱形图的页面去、method代表方法名称

struts.xml

其实柱形图主要是在前端代码那边、后台基本只是取数据、也没什么特殊。

记得导包哦~

此处的iterator的value要与上面方法返回的“slist”一致、这里是取后台的赋值给a0到a11。

下面还有、到s.index==11

这个东东就是将来要显示柱形图的位置哦~~

这里还是传值

接下来就是生成柱形图的代码。MONTHS在上面已经定义好了、就是表示X坐标

label是这个数据的名称、显示在柱形图上头的、因为是手动输入、每次都不同、所以这里没写

data就是每个柱形条的高度、即Y坐标、后面还有个0表示最少是0、如果不加可能每次会用最小的数据作为Y轴的最小值、而不是从0开始

type：bar就是柱形图的意思、你也可以换成line、就是折线图等等等等

borderSkipped：buttom就是柱形图从底下形成顶上来。

接上面的代码

记得放在<script></script>里面哦~~

最后一个css样式、

other.css

好啦~~最后生成的页面就是这样

输入沙发、点击开始统计

sale.jsp

生成这个就是成功啦~~~当然、前提是你要保证数据库有数据啦、

saleshow.jsp

对了、这个在eclipse上面看不到哦！要去网页打开看啦~

感觉一定有更为简单的办法、但是介于知识水平暂时就到这里、就先做到这里吧、以后有进步再来发新的。