需准备FusionChartsFree插件的FusionCharts.js文件和FCF_Column3D.swf两个文件
官方链接地址
FusionCharts.js：
http://www.fusioncharts.com/free/demos/Blueprint/FusionCharts/FusionCharts.js
FCF_Column3D.swf：
http://www.fusioncharts.com/free/demos/Blueprint/FusionCharts/FCF_Column3D.swf
效果如下
代码(可直接用，若失效可自行下载FusionCharts.js和FCF_Column3D.swf这两个文件)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script language="Javascript" src="http://www.fusioncharts.com/free/demos/Blueprint/FusionCharts/FusionCharts.js"></script>
<body>
<div id="chart1div"></div>
<script language="JavaScript">
var areaObject=[{name:"三枪",count:1100,color:"008E8E"},
{name:"刺陵",count:901,color:"A186BE"},
{name:"熊猫大侠",count:807,color:"F6BD0F"},
{name:"大兵小将",count:41,color:"AFD8F8"},
{name:"花田囍事2010",count:741,color:"B3AA00"},
{name:"全称热恋",count:121,color:"008ED6"}
];
var strXML="<graph caption='最烂电影排名' xAxisName='电影名' yAxisName='count' baseFont='宋体' baseFontSize='12' >";
var length=areaObject.length;
for(var i=1;i<=length;i++){
strXML= strXML+"<set name='"+areaObject[i-1].name+"' value='"+areaObject[i-1].count+"' color='"+areaObject[i-1].color+"'/>";
}
strXML= strXML+"</graph>";
var chart1 = new FusionCharts("http://www.fusioncharts.com/free/demos/Blueprint/FusionCharts/FCF_Column3D.swf", "chart1Id", "500", "400");
chart1.setDataXML(strXML);
chart1.render("chart1div");
</script>
</body>
</html>
分享到：
相关推荐
这个简单的例子展示了如何利用JavaScript和JSON数据来实现交互式、富有视觉吸引力的图表，这对于数据分析和报告呈现非常有用。在实际应用中，你可以根据需要调整图表属性、颜色、动画效果等，以满足不同的展示需求。
FusionCharts支持JSON、XML、CSV等多种数据格式，可以根据项目需求选择合适的方式传递数据。 FusionCharts Free对于数据动态更新也有很好的支持。一旦数据源发生变化，图表会自动更新，无需手动刷新页面。这种实时...
3. **数据源设置**：FusionCharts支持JSON、XML和CSV格式的数据源。数据可以内嵌在HTML中，也可以通过服务器动态生成。例如，使用JSON数据源： ```javascript var chartData = { "chart": { "caption": "年度...
2. **数据格式**：FusionCharts支持XML、JSON、CSV等多种数据格式，使得数据集成变得简单。开发者可以根据项目需求选择最适合的数据输入方式。 3. **交互性**：FusionCharts的图表是动态的，用户可以进行点击、缩放...
2. **Examples**：这里包含了一系列的示例代码，展示了如何使用FusionCharts Free创建各种图表，对初学者来说非常有帮助，可以通过查看和修改这些例子来快速上手。 3. **Documentation**：文档部分提供了详细的API...
**FusionCharts Free** 是一款基于Flash技术的免费图表工具，专为生成各种统计和数据可视化图表而设计。它以其丰富的图表类型、优秀的交互性和跨平台兼容性在IT行业中受到广泛应用。这款工具允许用户通过XML数据格式...
FusionCharts支持XML、JSON、CSV等多种数据格式，开发者可以选择适合项目需求的方式。在示例中，会展示如何将数据嵌入到HTML文档内，或者通过外部文件加载。 4. **图表类型**：深入学习每种图表类型的特点和用法，...
使用FusionCharts Free，开发者可以轻松地将数据转换为动态图表，支持XML、JSON等多种数据格式，便于与后端数据接口对接。控件支持多种图表类型的创建，包括但不限于条形图、折线图、饼图、散点图等，还支持自定义...
它支持XML或JSON格式的数据输入，这使得数据的处理和更新变得更加灵活。通过调整XML或JSON配置文件，可以改变图表的颜色、样式、标签以及动画效果，满足不同场景的需求。 其次，FusionCharts Free提供了丰富的图表...
通过简单的API调用和数据格式化，就可以生成具有专业品质的动态图表。此外，FusionCharts还支持JSON、XML等多种数据格式，使得数据绑定变得更加灵活。 总结来说，FusionCharts Free是一款功能强大的免费图表插件，...
7. **数据源灵活**：支持从XML、JSON、CSV、数据库等多种数据源获取数据。 **应用场景** FusionCharts Free广泛应用于商业报告、网站统计、数据分析、项目管理等多个领域。它可以用于展示销售报告、财务分析、客户...