年底了,公司要统计销售数据,于是就找了几个开源免费的chart程序来研究,PHP/SWF Charts 和 FusionCharts Free,不过最终还是选择了Open Flash Char,官方提供了很多实例,而做订单的销售统计并不需要多么花哨的东西,OFC2的功能也已经足够强大了。
2.0的版本数据格式完全用json来处理,非常灵活,官方提供了各种接口程序,包括PHP/PHP5、Pear、Python、Java、Dotnet,调用很简单
<html>
<head>
<script type=”text/javascript” src=”js/swfobject.js”></script>
<script type=”text/javascript”>
swfobject.embedSWF(
“open-flash-chart.swf”, “my_chart”, “550″, “200″,
“9.0.0″, “expressInstall.swf”,
{“data-file”:”data.txt”}
);
</script>
</head>
<body>
<p>Hello World</p>
<div id=”my_chart”></div>
</body>
</html>
数据文件格式如下:
{
“y_legend”:{
“text”: “Time of day”,
“style”: “{color: #736AFF;}”
},
“elements”:[
{
"type": "line",
"colour": "#736AFF",
"text": "Avg. wave height (cm)",
"font-size": 10,
"width": 2,
"dot-size": 4,
"halo-size": 0,
"values" : [1.5,1.69,1.88,2.06,2.21,2.34,2.43,2.48,2.49,2.47,2.40,2.30,2.17,2.01,1.83,1.64,1.44,1.24,1.05,0.88,0.74,0.62,0.54,0.50,0.50,0.54,0.61,0.72,0.86,1.03,1.22,1.41,1.61,1.81,1.99,2.15,2.29,2.39,2.46,2.49,2.48,
{"value":2.44,"colour":"#FF0000","tip":"monkies"},2.35,2.23,2.08]
}
], “x_axis”:{
“labels”: {
“rotate”: “vertical”,
“labels”:["2:00am % ?,"2:10","2:20","2:30","2:40","2:50",
"3:00am","3:10","3:20","3:30","3:40","3:50",
"4:00am","4:10","4:20","4:30","4:40","4:50",
"5:00am","5:10","5:20","5:30","5:40","5:50",
"6:00am","6:10","6:20","6:30","6:40","6:50",
"7:00am","7:10","7:20","7:30","7:40","7:50",
"8:00am","8:10","8:20","8:30","8:40","8:50",
"9:00am","9:10","9:20"]
}
},
“y_axis”:{
“max”: 3
}}
数据放在data.txt里,演示
