FusionCharts在Java中的基本使用
2015/3/29 1:06:51 getbyid 程序员俱乐部 我要评论(0)
摘要:一、介绍FusionCharts是一个基于XML和Flash的图表组件,其中FusionChartsFree是免费的,其功能也十分强大、美观。在线Demo:http://www.fusioncharts.com/free/demos/Blueprint/其可以用在PHP、JSP、ASP等等。二、常见的图表类型1.Area图2.Bar图3.Column图4.Line图5.Pie图6.Stacked图7.Combine图三、数据源其数据源形式为XML的形式,XML形式分为单序列和多序列XML
一、介绍
FusionCharts是一个基于XML和Flash的图表组件,其中FusionCharts Free是免费的,其功能也十分强大、美观。
在线Demo:http://www.fusioncharts.com/free/demos/Blueprint/
其可以用在PHP、JSP、ASP等等。
二、常见的图表类型
1.Area图
2.Bar图
3.Column图
4.Line图
5.Pie图
6.Stacked图
7.Combine图
三、数据源
其数据源形式为XML的形式,XML形式分为单序列和多序列XML,以及其他的格式。
四、简单使用
目录结构:
test.html
data.xml
FusionCharts
|----------Charts
| |--------------- many charts *.swf
|----------JSClass
| |--------------- FusionCharts.js
test.html代码:
图
var chart = new FusionCharts('FusionCharts/Charts/FCF_Pie2D.swf', "ChartId", "400", "300"); chart.setDataURL("data.xml"); chart.render('Pie'); |
要注意添加以下几行代码,并注意其中的路径:
(1)导入JS:
(2)图表显示的地方:
(3)脚本:用于设置显示什么图、图的数据等
var chart =
new FusionCharts('FusionCharts/Charts/FCF_Pie2D.swf ', "ChartId", "400", "300");
chart.setDataURL("data.xml");
chart.render('Pie ');
其中,chart.render("Pie")中的Pie是你要显示图的div的id
data.xml
也可以不用单独的文件存储xml,可以利用setDataXML方法,如下:
var chart =
new FusionCharts('FusionCharts/Charts/FCF_Pie2D.swf', "ChartId", "400", "300");
chart.setDataXML("");
chart.render('Pie');