jquery chart处理
各种语言都有很多 关于chart的api、例如java的jfreechart 等。。。
由于单位的业务需要、需要在前台使用jquery生成相关的图标
所以最近找到了一个jgcharts.pack.js来处理业务。
美中不足的是 jgcharts 不支持 ie6 [ie7 ie8 还没有测试]
虚拟需求1:分析年龄段在 20-30 40-50 50-60 年龄范围的客户群体饼形图。
虚拟数据位
20-30 7400人30-40 5000人40-50 3000人50-60 1200人
具体代码实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <script style="max-width: 100%;height: auto;width: auto\9;" src="http://www.reader8.com/lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script><script style="max-width: 100%;height: auto;width: auto\9;" src="http://www.reader8.com/jgcharts.pack.js" type="text/javascript"></script><script>var api = new jGCharts.Api();jQuery('<img>').attr('src', api.make({axis_labels : ['20岁-30岁','30岁-40岁','40岁-50岁','50岁-60岁'],data : [[7400], [5000], [3000], [1200]],colors : ['f8b038'],type : 'p3',//default bvgsize : '400x200',title : '客户群体年龄范围数据分析'})).appendTo("#bar1");});</script></head> <body><div id="bar1"></div></body></html>