1、通过改变指标，改变柱形图显示结果
ChangeColumn.html：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>改变参数的柱形图</title>
<script type="text/javascript" src="../Scripts/JS/jquery-1.10.2.js"></script>
<script type="text/javascript" src="../Scripts/JS/FusionCharts.js"></script>
<style type="text/css">
.body_table{
100%;
height: 100%;
font-size: 18px;
color: #FF8800;
background-color:#CCCCCC;
font-family: serif sans-serif cursive fantasy;
}
#tab{
100%;
height: 100%;
}
.tr_td input{
color: #FF8800;
}
</style>
<script type="text/javascript">
$(function(){
var column = new FusionCharts( "../Scripts/FusionChart/Column2D.swf", "columnId", "1280", "510", "0", "1" );
column.setXMLUrl("column2D.xml");
column.render("columnContainer");
});
function changeColumn(xmlUrl){
var column = new FusionCharts( "../Scripts/FusionChart/Column2D.swf", "columnId", "1280", "510", "0", "1" );
column.setXMLUrl(xmlUrl);
column.render("columnContainer");
}
</script>
</head>
<body class="body_table">
<table id="tab">
<tr>
<td class="tr_td">
<input type="radio" id="" name="state" οnclick="changeColumn('column2D1.xml')"/>学号
<input type="radio" id="" name="state" οnclick="changeColumn('column2D2.xml')"/>姓名
<input type="radio" id="" name="state" οnclick="changeColumn('column2D3.xml')"/>性别
</td>
</tr>
<tr>
<td>
<div id="columnContainer"></div>
</td>
</tr>
</table>
</body>
</html>2、显示默认柱形图，column2D.xml提供数据源
（1）源码column2D.xml：
<?xml version="1.0" encoding="UTF-8"?>
<chart yAxisName="人数" caption="人数分布统计图" useRoundEdges="1" xAxisName="分数范围" baseFontSize='14'
bgColor="FFFFFF,FFFFFF" showBorder="0" showLegend="1">
<set label="0-10" value="5" />
<set label="10-20" value="12" />
<set label="20-30" value="36" />
<set label="30-40" value="12" />
<set label="40-50" value="34" />
<set label="50-60" value="85" />
<set label="60-70" value="184" />
<set label="70-80" value="196" />
<set label="80-90" value="124" />
<set label="90-400" value="68" />
</chart>（2）显示结果如下图：
3、选择“学号”，column2D1.xml提供数据源
（1）源码column2D1.xml
<?xml version="1.0" encoding="UTF-8"?>
<chart yAxisName="分数" caption="分数分布统计图" useRoundEdges="1" xAxisName="学号" baseFontSize='14'
bgColor="FFFFFF,FFFFFF" showBorder="0" showLegend="1">
<set label="2013010101" value="85" />
<set label="2013010102" value="80" />
<set label="2013010103" value="90" />
<set label="2013010104" value="95" />
<set label="2013010105" value="75" />
<set label="2013010106" value="65" />
<set label="2013010107" value="84" />
<set label="2013010108" value="96" />
<set label="2013010109" value="88" />
<set label="2013010110" value="78" />
</chart>（2）显示结果如下图：
4、选择“姓名”，column2D2.xml提供数据源
（1）源码column2D2.xml
<?xml version="1.0" encoding="UTF-8"?>
<chart yAxisName="分数" caption="分数分布统计图" useRoundEdges="1" xAxisName="姓名" baseFontSize='14'
bgColor="FFFFFF,FFFFFF" showBorder="0" showLegend="1">
<set label="王二" value="85" />
<set label="李四" value="72" />
<set label="赵倩" value="96" />
<set label="西门红" value="62" />
<set label="上官里" value="68" />
<set label="诸葛流云" value="79"/>
<set label="魏巍" value="84" />
<set label="钱三" value="95" />
<set label="孙文" value="90" />
<set label="郑武" value="70" />
</chart>
5、选择“性别”，column2D3.xml提供数据源
（1）源码column2D3.xml：
<?xml version="1.0" encoding="UTF-8"?>
<chart yAxisName="人数" caption="人数分布统计图" useRoundEdges="1" xAxisName="性别" baseFontSize='14'
bgColor="FFFFFF,FFFFFF" showBorder="0" showLegend="1">
<set label="男" value="285" />
<set label="女" value="172" />
</chart>