|
与后台交互使用的是原生的ajax方法,尝试过使用jquery提供的ajax,但是没有生效。
这种初始化方式可以初始化free版本和企业版本,已经测试过。
JS部分://初始化图表function getXmlHttp() {return window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");}function initChart(){var xmlhttp = getXmlHttp(); if (xmlhttp) {var chartUrl="${loadChartUrl}";xmlhttp.open("get", chartUrl, true);xmlhttp.onreadystatechange = function() {if (xmlhttp.readyState == 4) {if(xmlhttp.responseText == null || xmlhttp.responseText == '') {alert("与服务器失去连接");} else {//alert(xmlhttp.responseText);var xml=xmlhttp.responseText;var xml1=xml.split("$")[0];//这里使用$符号分割,可将后台传入的xml分割开,同时初始化多个chartvar xml2=xml.split("$")[1];var chart1 = new FusionCharts("${ctx}/common/js/fusionCharts3.1/Charts/Column3D.swf", "ChartId", "400", "300","","");chart1.setDataXML(xml1);chart1.render("chartdiv");var chart2 = new FusionCharts("${ctx}/common/js/fusionCharts3.1/Charts/MSColumn3D.swf", "ChartId", "600", "300","","");chart2.setDataXML(xml2);chart2.render("MSColumn3DChartdiv");}}};xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');xmlhttp.send();//setTimeout("getInfo12()",60000);}} 后台代码:
//加载图表@RequestMapping(params ="action=loadChart")public void loadChart(RenderResponse renderResponse,Model model){//response.setCharacterEncoding("utf-8");List reslutList=auditWorkService.getAdtResultDistribution();//获得数据String xmlConfig = adtResultXmlConfigByType(reslutList,"审计结果分布(按规则类型)");xmlConfig=StringUtils.escapeXmlForJs(xmlConfig);try {renderResponse.setContentType("text/xml");PrintWriter out = renderResponse.getWriter();out.write(xmlConfig);out.flush();out.close();} catch (IOException e) {e.printStackTrace();logger.error(e.getMessage());}}//生成审计结果分布XMLprivate String adtResultXmlConfigByType(List reslutList ,String name) {Document doc = new DocumentImpl();Element root = doc.createElement("chart");String xAxisName = "x";String yAxisName = "审计结果数量";root.setAttribute("caption", name);root.setAttribute("decimalPrecision", "0");root.setAttribute("formatNumberScale", "0");root.setAttribute("showBorder", "0");//root.setAttribute("subcaption", xAxisName);root.setAttribute("useRoundEdges", "1");//root.setAttribute("lineColor", "83ADCD");root.setAttribute("baseFontSize", "12");//改变字体大小root.setAttribute("baseFont", "宋体");//改变字体大小root.setAttribute("canvasBgColor", "efefef");//设置背景色root.setAttribute("canvasBaseColor", "bebebe");//设置底座颜色root.setAttribute("yAxisName", yAxisName);//设置y轴名称//root.setAttribute("xAxisName",xAxisName );/*Element categoriesElement = doc.createElement("categories");Element datasetElement = doc.createElement("dataset");datasetElement.setAttribute("seriesname","问题数");datasetElement.setAttribute("showValue","1");datasetElement.setAttribute("color","4478b7");*/for(int i=0;i<reslutList.size();i++){Object[] row = (Object[])reslutList.get(i);String typeName="";/*Element categorieElement = doc.createElement("category");categorieElement.setAttribute("name",typeName);categorieElement.setAttribute("hoverText",typeName);categoriesElement.appendChild(categorieElement);*/Element setElement = doc.createElement("set");setElement.setAttribute("label",typeName);setElement.setAttribute("value",row[1].toString());setElement.setAttribute("color","4478b7");//设置下钻函数传入规则类型setElement.setAttribute("link","JavaScript:showResultByRule("+row[0].toString()+");");/*datasetElement.setAttribute("color","4478b7");datasetElement.appendChild(setElement);*/root.appendChild(setElement);}/*root.appendChild(categoriesElement);root.appendChild(datasetElement);*/doc.appendChild(root);OutputFormat of = new OutputFormat("XML", "UTF-8", false);of.setLineSeparator(null);of.setDoctype(null, null);StringWriter stringOut = new StringWriter();XMLSerializer serializer = new XMLSerializer(stringOut, of);try {serializer.serialize(doc);} catch (IOException e) {e.printStackTrace();}return stringOut.toString();} |
|