简单介绍下FusionCharts MS Column 3D的应用。效果图如下:
数据生成采用不生成xml的方式,数据xml如下:
<chart caption='example' subCaption='Sum I_RIGHT_RATE by city' shownames='1' showvalues='0' decimals='0' numberPrefix='$' > <categories> <category label='上海市' /> <category label='北京市' /> <category label='天津市' /> <category label='广州市' /> <category label='石家庄市' /> <category label='深圳市' /> <category label='重庆市' /> </categories> <dataset seriesName='FACTSTA_TIMES' color="FB80F0" showValues="0"> <set value='98' /> <set value='292' /> <set value='90' /> <set value='88' /> <set value='96' /> <set value='92' /> <set value='100' /> </dataset> <dataset seriesName='INTIMESTA_TIMES' color="FBF1F0" showValues="0"> <set value='82' /> <set value='243' /> <set value='85' /> <set value='75' /> <set value='86' /> <set value='80' /> <set value='90' /> </dataset> <dataset seriesName='LIMITSTA_TIMES' color="8BF280" showValues="0"> <set value='17' /> <set value='49' /> <set value='15' /> <set value='13' /> <set value='10' /> <set value='12' /> <set value='10' /> </dataset> </chart>
staticsChart.jsp
被调用显示chart的jsp,通常需要include一个返回chart数据的jsp。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="org.apache.commons.logging.Log"%> <%@page import="org.apache.commons.logging.LogFactory"%> <%@page import="com.dhcc.cimiss.st.bs.template.FusionChartUtil"%> <%@page import="com.dhcc.cimiss.st.bs.template.FusionChartsDTO"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <%@ include file = "../../bs/Includes/FusionCharts.jsp" %> <HTML> <HEAD> <TITLE>MS Column 3D</TITLE> <link rel="stylesheet" type="text/css" href="<%=path%>/css/st/css.css" /> <link rel="stylesheet" type="text/css" href="<%=path%>/css/st/home.css" /> <SCRIPT LANGUAGE="Javascript" SRC="<%=basePath%>FusionCharts/FusionCharts.js"></SCRIPT> <style type="text/css"> <!-- body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; } .text{ font-family: Arial, Helvetica, sans-serif; font-size: 12px; } --> </style> </HEAD> <BODY> <CENTER> <h2>查询表TAB_OMIN_ST_G_SDATAAREA_H</h2> <% Log logger = LogFactory.getLog(getClass()); String animate = (String)request.getAttribute("animate"); String dataPath = path +"/jsp/st/sa/statistics_analysis/columnData.jsp?animate="+ animate; String swfPath = path +"/FusionCharts/MSColumn3D.swf"; logger.info("^^^^^^^^^^^^^^^^^^^^^^^^^ dataPath = "+ dataPath); FusionChartsDTO fusionCharts = new FusionChartsDTO(); fusionCharts.setStrDataURL(dataPath); fusionCharts.setAddNoCacheStr("false"); fusionCharts.setResponse(response); fusionCharts.setSwfURL(swfPath); fusionCharts.setDataURL("dataPath"); fusionCharts.setChartId("FactorySum"); fusionCharts.setChartWidth(600); fusionCharts.setChartHeight(300); fusionCharts.setDebugMode(false); fusionCharts.setRegisterWithJS(false); String chartCode = FusionChartUtil.genChart(fusionCharts); out.print(chartCode); out.print("<p><p>"); out.print((String)request.getAttribute("tableData")); %> <BR> <BR> </CENTER> </BODY> </HTML>
columnData.jsp
返回chart数据的jsp,被include在staticsChart.jsp中
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <%@ page import="java.io.*"%> <%@ page import="com.test.ChartXmlDataProvider"%> <% String strXML=""; //Default.jsp has passed us a property animate. We request that. String animateChart; animateChart = request.getParameter("animate"); //Set default value of 1 if(null==animateChart||animateChart.equals("")){ animateChart = "1"; } String strQuery = "select I_CITY_NAME,sum(I_FACTSTA_TIMES) as FACTSTA_TIMES,"+ " sum(I_INTIMESTA_TIMES) as INTIMESTA_TIMES,sum(I_LIMITSTA_TIMES) as LIMITSTA_TIMES"+ " from tab_omin_st_g_sdataarea_h group by I_CITY_NAME"; String[] seriesNames = new String[3]; seriesNames[0] = "FACTSTA_TIMES"; seriesNames[1] = "INTIMESTA_TIMES"; seriesNames[2] = "LIMITSTA_TIMES"; strXML = new ChartXmlDataProvider().getXmlDataOfMSColumn3D(strQuery,"MSColumn3D",seriesNames); //logger.info("^^^^^^^^^^^^^^^^^^^^^^^^^ pieData strXML = "+ strXML); //Set Proper output content-type response.setContentType( "text/xml; charset=UTF-8" ); OutputStream outs = response.getOutputStream(); outs.write( new byte[]{(byte)0xEF, (byte)0xBB, (byte)0xBF} ); outs.write(strXML.getBytes("UTF-8")); outs.flush(); outs.close(); outs = null; response.flushBuffer(); out.clear(); out = pageContext.pushBody(); %>
其他相关类:
FusionChartsDTO.java
public class FusionChartsDTO { private String strDataURL;//data jsp url private String addNoCacheStr;// private HttpServletResponse response; private String swfName; private String swfURL;//swf file url private String dataXML;//"" private String dataURL; private String chartId; private int chartWidth; private int chartHeight; private boolean debugMode;//false private boolean registerWithJS;//false public String getStrDataURL() { return strDataURL; } public void setStrDataURL(String strDataURL) { this.strDataURL = strDataURL; } public String getAddNoCacheStr() { return addNoCacheStr; } public void setAddNoCacheStr(String addNoCacheStr) { this.addNoCacheStr = addNoCacheStr; } public HttpServletResponse getResponse() { return response; } public void setResponse(HttpServletResponse response) { this.response = response; } public String getSwfURL() { return swfURL; } public void setSwfURL(String swfurl) { swfURL = swfurl; } public String getChartId() { return chartId; } public void setChartId(String chartId) { this.chartId = chartId; } public int getChartWidth() { return chartWidth; } public void setChartWidth(int chartWidth) { this.chartWidth = chartWidth; } public int getChartHeight() { return chartHeight; } public void setChartHeight(int chartHeight) { this.chartHeight = chartHeight; } public boolean isDebugMode() { return debugMode; } public void setDebugMode(boolean debugMode) { this.debugMode = debugMode; } public boolean isRegisterWithJS() { return registerWithJS; } public void setRegisterWithJS(boolean registerWithJS) { this.registerWithJS = registerWithJS; } public String getDataXML() { return dataXML; } public void setDataXML(String dataXML) { this.dataXML = dataXML; } public String getDataURL() { return dataURL; } public void setDataURL(String dataURL) { this.dataURL = dataURL; } public String getSwfName() { return swfName; } public void setSwfName(String swfName) { this.swfName = swfName; } }
ChartXmlDataProvider.java
查询数据库返回chart数据
public class ChartXmlDataProvider { private static Logger logger = Logger.getLogger(ChartXmlDataProvider.class); public String getXmlDataOfMSColumn3D(String sql,String getDataType,String[] seriesNames){ String cityName = ""; String paramvalue = ""; StringBuffer dataBuffer = new StringBuffer(""); dataBuffer.append("<chart caption='example' subCaption='Sum I_RIGHT_RATE by city' " + "shownames='1' showvalues='0' decimals='0' numberPrefix='$' "); if(getDataType.equals(ChartConstants.CHART_TYPE_MS_COLUMN3D)){ dataBuffer.append(">"); } try{ DAO dao = BF.getDAO(); List<Map> rsList = dao.executeQuery(sql,"查询数据"); //categories dataBuffer.append("<categories>"); for (Map map : rsList) { cityName = (String)map.get("I_CITY_NAME"); dataBuffer.append("<category label='"+ cityName +"' />"); } dataBuffer.append("</categories>"); String[][] series = this.getSeries(seriesNames); for(int i = 0; i < seriesNames.length; i++){ dataBuffer.append("<dataset seriesName='"+ seriesNames[i] +"' color=\""+ series[i][1] +"\" showValues=\"0\">"); for (Map map : rsList) { paramvalue = ((BigDecimal)map.get(seriesNames[i])).toString(); dataBuffer.append("<set value='" +paramvalue+ "' />"); } dataBuffer.append("</dataset>"); } dataBuffer.append("</chart>"); logger.info("^^^^^^^^^^^^^^^^^^^^^^^^^ MSColumn3D strXML = "+ dataBuffer.toString()); }catch (Exception e) { e.printStackTrace(); } return dataBuffer.toString(); } /** * 获取series数据 * @param seriesNames * @return */ private String[][] getSeries(String[] seriesNames){ int baseLength = seriesNames.length; char letter = 'A'; char[] letters = new char[baseLength]; for(int i = 0; i < baseLength; i++){ letter += 5; letters[i] = letter; logger.info("letters["+ i +"] = "+ letters[i]); if(letter >= 'K'){ letters[i] = 'F'; if(letter >= 'P'){ letters[i] = '8'; } } } String[] seriesColors = new String[baseLength]; for(int j = 0; j < baseLength; j++){ int index = (j+2) >= baseLength ? 0 : (j+2); seriesColors[j] = letters[j] +"B"+ letters[index] + j + letters[j] + '0'; } String[][] series = new String[seriesNames.length][2]; for(int i = 0; i < seriesNames.length; i++){ series[i][0] = seriesNames[i]; series[i][1] = seriesColors[i]; } return series; } }