作者:zccst
amcharts,应该跟fusionCharts和HightCharts一样,是首选。
fusionCharts目前已经基本弃用。(原因是引用了很多Flash)
其实,主要也就amcharts和HightCharts。其他的还在了解中
1,后来发现中文文档真是差劲,根本解决不了我的问题。
比如,我希望饼图填满整个正方形区域。
经查询API才知道有一个radius和minRadius的属性,解决了我的问题。所以还得是官方文档啊!
原版API地址(饼图的):
http://docs.amcharts.com/3/javascriptcharts/AmPieChart
2,还有,重新设置数据后chart.validateNow();兵没有立即生效,查询API后才发现,应该调用validateData()
两者的区别:
validateData() This method should be called after data in your data provider changed or a new array was set to dataProvider. After calling this method the chart will parse data and redraw.
validateNow() This method should be called after you changed one or more properties of any class. The chart will redraw after this method is called.
详见AmChart API:
http://docs.amcharts.com/3/javascriptmaps/AmChart
3,想获取渲染之后各块的颜色值(饼图的各个组成部分)
在PHP端定义一个数组:
public $pieColors = array("#FF0F00", "#FF6600", "#FF9E01", "#FCD202", "#F8FF01", "#B0DE09", "#04D215", "#0D8ECF", "#0D52D1", "#2A0CD0", "#8A0CCF", "#CD0D74", "#754DEB", "#DDDDDD", "#999999", "#333333", "#000000", "#57032A", "#CA9726", "#990000", "#4B0C25");
并在action中传到前端 'pieColors' => $this->pieColors ;
在js端:
var pieColors = JSON.parse('<?php echo json_encode($pieColors);?>');//注意有延迟,不能直接赋值
chart.pieColors = pieColors;
在HTML中:循环每一个$index时
<?php foreach ($xxxxx as $index=>$item) {?>
<div style="width:10px;height:10px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:<?php echo $pieColors[$index]; ?>"></div>
<?php }?>
最终的参数:
chart = new AmCharts.AmPieChart();
chart.dataProvider = data;
chart.titleField = "name";
chart.valueField = "money";
chart.radius = 58;//minRadius最小半径,width/2,height/2中的最小值
chart.labelText = ""; //chart.labelText = "[[percents]]%";
chart.balloonText = "";//鼠标悬浮在charts时的文字
chart.pieColors = pieColors;
chart.clickSlice = function(){//取消点击事件
return false;
}
chart.write("pieCharts");
amcharts图表使用总结
http://wenku.baidu.com/link?url=DiECsZ1f94wkFKUmacZG44uJ4eD3OS_qYPJ6vtxGv0PQjPchXcDLVXmNCSmz1IcTLzMNloDy4sgaRC9213wuBZ5_Uly8dGIni_sfCD6xILe
如果您觉得本文的内容对您的学习有所帮助,您可以微信:
分享到:
相关推荐
amCharts免费版本开发的参数及讲解
amcharts3用户指南,属性设置、方法列表,样例图表,柱状图、饼图、线型图、漏斗图、立体图,条形图,使用说明
关于amCharts的五种免费图表使用笔记
amcharts Amcharts是一组Flash图表,你可以免费使用在你的网站和基于网络的产品。 Amcharts可以从简单的CSV或XML文件提取数据,也可以从动态数据读取生成
Amcharts JS属性、方法详细使用说明/开发文档,中文版
amcharts 绿色版
js版本的amchartsjs版本的amcharts
HTML5图表amCharts教程下载
amCharts导出图片JAVA实现amCharts导出图片JAVA实现
amcharts柱状图案例,可以参考。
amcharts asp.net 柱状图
WPF中使用amCharts绘制股票K线图源码的demo
amcharts flex帮助文档,里边包含了amcharts饼状图、线状图、柱状图、等一些保镖图形的事例;
amCharts图表组件,支持柱状图、条形图、线形图、面积图、烛台图、雷达等基本图形
Amcharts 的jsp ajax 实现 Myeclipse源代码工程 Amcharts 的jsp ajax 实现 Myeclipse源代码工程 Amcharts 的jsp ajax 实现 Myeclipse源代码工程 Amcharts 的jsp ajax 实现 Myeclipse源代码工程
amCharts(.NET版)图形报表的使用实例 带VS2010工程文件 可直接运行。 首先需要添加dll引用,然后再把相关文件放到目录里就像在项目里添加FCK编辑器一样.这样的话.开始的环境就好了.我的目录结构是这样的 当然,在每个...
amcharts破解版可用无链接,绝对值得下载的好资源,让你的网页轻松使用图表
AmCharts Docs基于官方网址制作: http://docs.amcharts.com/javascriptchart
amcharts 折线图 asp.net版
基于官方最新4.5.15的版本 完美去掉了左下角logo。测试几个图形都没问题