先看效果图
FusionCharts自认为是所有报表中,开发代码最简单的,只需要写后台业务代码,前台展示不需要自己写。比JFreeChart要简单。直接贴代码。
前台代码
<tr>
<td class="td3" colspan="2">
<div class="column">
<h4>
最近一个月群众反映问题十大领域统计:
</h4>
<!--
<img src="<%=baseURL %>/zjxf/common/images/index_img2.jpg" />
-->
<div id="column3D2"></div><!-- 用于展示报表的层 -->
</div>
</td>
</tr>
Jquery代码
$.post('<%=baseURL%>/reportAction.do?method=reportDataShowNO1',function(result){
var column3D1 = new FusionCharts("<%=baseURL%>/zjxf/3d/Column3D.swf", "myChartId", "100%", "195");
column3D1.setDataXML(result);
column3D1.render("column3D1");
});
后台Java代码
/**
* 后台报表数据展示,十大问题类型统计
* @param mapping
* @param form
* @param request
* @param response
* @return
* @throws Exception
*/
public ActionForward reportDataShowNO2(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
response.setCharacterEncoding("gbk");
List<Object[]> list = this.zjxfItemProUserService.findReportDataNO2();
String xml = "<chart showValues='0' palette='0' shownames='1' legendBorderAlpha='0' useRoundEdges='1'";
xml += "animation='1' decimalPrecision='0' formatNumberScale='0' baseFont='Arial' baseFontSize='12' rotateYAxisName='0' showFCMenuItem='0' maxColWidth ='30'>";
if(list != null && list.size() > 0){
for(Object[] s : list){
xml += "<set label='" + (s[0] == null ? "" : String.valueOf(s[0])) + "' value='" + (s[1] == null ? "" : String.valueOf(s[1])) + "' />";
}
}
xml += "</chart>";
response.getWriter().print(xml);
return null;
}
这样就搞定了,导入所需要的JS和CSS即可。
附件:SWF和JS
不能上传附件,直接搜索FusionCharts即可。