Flash图表组件FusionCharts帮助文档十：将柱状图转换为饼状图

来源：互联网发布：英文网络用语编辑：程序博客网时间：2024/05/17 04:56

你有没有想过，将 FusionCharts 创建好的柱状图转换为一张饼状图，并且不需要改变初始数据。这个转换后的饼状图仍然支持动画和交互性（如饼图的分片、用鼠标旋转、标签工具条等）。

很简单，要改变图表类型，只需编辑先前的代码，更改SWF文件名称为Pie3D.swf。

柱状图,FusionCharts 饼状图,FusionCharts

在本例中，复制 weekly-sales.html 并将它在同一个文件夹中保存为weekly-sales-pie.html。最后，编辑HTML代码：

<html>  <head>            <title>My First chart using FusionCharts XT - change chart type</title>         <script type="text/javascript" src="FusionCharts/FusionCharts.js"></script>  </head>     <body>         <div id="chartContainer">FusionCharts XT will load here!</div>              <script type="text/javascript"><!--       var myChart = new FusionCharts( "FusionCharts/Pie3D.swf",                      "myChartId", "400", "300", "0", "1" );      myChart.setXMLUrl("Data.xml");      myChart.render("chartContainer");          // -->    </script>        </body> </html>

解释一下上面这段代码，我们已经改变了SWF文件路径，之前是指向Column3D.swf的，现在指向Pie3D.swf。你需要从Charts 文件夹中复制Pie3D.swf。如果你现在在浏览器中打开HTML文件，会看到类似于下面这种饼图（点击图片查看在线Demo）：

饼状图,FusionCharts

单击饼图分片，分片扇形就会分离出来。或者在图表上右键单击选中"Enable Rotation"，就可以用鼠标拖拽图表进行旋转。

注意，我们之所以能够在不改变数据的情况下转换图表类型，是因为新的图表类型与初始数据是兼容的。比如，在本例中，我们是将一个单序列的柱状图转换为单序列的饼图。也就是说，只有在两个图表都是单序列的时候，图表类型的初始数据才是有效的。如果你想在单序列图表上使用多序列数据，那么图表上就不会有任何数据显示。