在使用FusionCharts过程中,需要显示中文汉字,经常会遇到乱码情况,1.横纵坐标的乱码,2.点击图形传值乱码。下面贴出解决方案。
建议采用dom4j组件生成xml文件
1.设置页面编码:UTF-8 可以防止横纵坐标中文汉字乱码
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
...
</html>
2.添加图形的点击事件:设置 <graph unescapeLinks="0"> 解决链接中传中文乱码
xml: link="JavaScript:showName('Java开发者')"
js: function showName(name){
alert(name); //会出现乱码
}
3.使用参考:1.生成xml格式文本流,可以采用拼接,也可以采用dom4j生成
String msg = "";
msg="<?xml version=1.0 encoding=GBK?>";
msg+="<graph caption='人物年龄列表' xAxisName='人名' yAxisName='年龄' " +"showNames='1' decimalPrecision='0' formatNumberScale='0'
baseFont='宋体' baseFontSize='14' unescapeLinks='0'>";
msg+="<set name='小明' value='21' color='"+getRandomColor()+"' link='JavaScript:showName('小明')' />";
msg+="<set name='小强' value='25' color='"+getRandomColor()+"' link='JavaScript:showName('小强')' />";
msg+="<set name='大力丸' value='47' color='"+getRandomColor()+"' link='JavaScript:showName('大力丸')' />";
msg+="<set name='主义者' value='85' color='"+getRandomColor()+"' link='JavaScript:showName('主义者')'/>";
msg+="<set name='追梦' value='37' color='"+getRandomColor()+"' link='JavaScript:showName('追梦')' />";
msg+="</graph>";
建议采用dom4j组件生成xml文件
public String getXMLString(List list){
String xmlstr="";
Document document = DocumentHelper.createDocument();
Element graph = document.addElement("graph");
graph.addAttribute("caption", "人物年龄列表");
graph.addAttribute("xAxisName", "人名");
graph.addAttribute("yAxisName", "年龄");
graph.addAttribute("showNames", "1");
graph.addAttribute("desimalPrecision", "0");
graph.addAttribute("formatNumberScale", "0");
graph.addAttribute("baseFont", "宋体");
graph.addAttribute("baseFontSize", "14");
graph.addAttribute("unescapeLinks", "0");
for(int i=0;i<list.size();i++){
Element set = graph.addElement("set");
Person p = list.get(i);
set.addAttribute("name", p.getname());
set.addAttribute("value", p.getage());
set.addAttribute("color", getRandomColor());
set.addAttribute("link", "JavaScript:showName('"+p.getname()+"')");
}
xmlstr = generateXML(document);
return xmlstr;
}
/**
* 通过dom生成xml文件
*/
public String generateXML(Document document) {
String xmlDoc = "";
StringWriter sw = new StringWriter();
XMLWriter writer;
OutputFormat format = OutputFormat.createPrettyPrint();
format.setEncoding("GBK");
writer = new XMLWriter(sw, format);
try {
writer.write(document);
xmlDoc = sw.toString();
URLEncoder.encode(xmlDoc, "utf-8");
} catch (IOException e) {
System.out.println("生成XML字符串发生异常");
e.printStackTrace();
} finally {
try {
writer.close();
sw.close();
} catch (IOException e) {
System.out.println("关闭XML读写发生异常");
e.printStackTrace();
}
}
return xmlDoc;
}
/**
* 随即获得颜色代码
*/
public String getRandomColor(){
//颜色代码位数6
int colorLength=6;
//颜色代码组数
char[] codeSequence={'A','B','C','D','E','F', '0','1','2','3','4','5','6','7','8','9'};
StringBuffer str=new StringBuffer();
Random random=new Random();
for(int i=0;i<colorLength;i++){
str.append(codeSequence[random.nextInt(16)]);
}
return str.toString();
}
4.页面显示
<script src="<s:url value="js/FusionCharts.js"/>" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="UTF-8">
$(document).ready(function(){
$.ajax({
type:'post',
url:'doPersonCharts.action',
data:'',
success:function(msg){
//最后的1.表示link可以显示,鼠标有手势
var chart=new FusionCharts("FusionCharts/Column3D.swf","chartId1","900","480","0","1");
chart.setDataXML(msg);
chart.render(personForm);
},
error:function(){
alert("加载失败,请重新加载...");
}
});
});
function showName(name){
alert(name);
}
</script>
<div align="center">
<table width="60%" border="0" name="personForm" id="personForm"></table>
</div>
参数的详细说明和功能特性:http://www.meisoft.cn/
无logo下载地址:http://download.csdn.net/detail/qiaoshuai0920/9175993
转载:http://cjp1989.iteye.com/blog/1843776