amcharts的使用

作者：zccst

amcharts，应该跟fusionCharts和HightCharts一样，是首选。

fusionCharts目前已经基本弃用。（原因是引用了很多Flash）

其实，主要也就amcharts和HightCharts。其他的还在了解中

1，后来发现中文文档真是差劲，根本解决不了我的问题。
比如，我希望饼图填满整个正方形区域。

经查询API才知道有一个radius和minRadius的属性，解决了我的问题。所以还得是官方文档啊！

原版API地址（饼图的）：
[url]http://docs.amcharts.com/3/javascriptcharts/AmPieChart[/url]

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：[url]http://docs.amcharts.com/3/javascriptmaps/AmChart[/url]

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图表使用总结
[url]http://wenku.baidu.com/link?url=DiECsZ1f94wkFKUmacZG44uJ4eD3OS_qYPJ6vtxGv0PQjPchXcDLVXmNCSmz1IcTLzMNloDy4sgaRC9213wuBZ5_Uly8dGIni_sfCD6xILe[/url]

如果您觉得本文的内容对您的学习有所帮助，您可以微信：
[img]http://dl2.iteye.com/upload/attachment/0109/0668/fb266dfa-95ca-3d09-b41e-5f04a19ba9a1.png[/img]

amcharts的使用相关推荐

Amcharts绑定新数据后不会刷新图表的解决办法
重新给Amcharts绑定数据源时,只需要改变 LineChart1.DataSource的属性,无需加上 DataBind() ,否则显示的还是绑定前的图表,或者提示这个时期没有数据:No data ...
amcharts 网页绘图插件
Amcharts是一组js图表,你可以免费使用在你的网站和基于网络的产品(非开源). Amcharts可以从简单的json提取数据,也可以从动态数据读取生成,比如PHP, .NET, Ruby on ...
Amcharts插件实现3D饼图
2019独角兽企业重金招聘Python工程师标准>>> 主要引入两个js文件: pie.js和amcharts.js 实现的效果如下: <!DOCTYPE HTML PUBLI ...
Amcharts 柱状图和线形图
最近需要学习 Amcharts ,他的图表功能确实很强大.但是网上搜索到的教程很少,开始学起的确有点不方便.于是我决定把我学习的觉得好的途径,放到博客上. 下面的代码可以直接复制,但是文件要从官网上下 ...
amcharts应用
查看选中的软件的下载量,通过amchart报表工具显示出软件日下载量,月下载量以及年下载量,下面简单介绍,amchart在struts2中的应用. amCharts提供JavaScript/HTML5 ...
amcharts去除版权标志
打开amcharts.js, 查找drb, 找到后,将drb:function(){......}程序{}中间内容清空, 或者改成drb:function(){return;}
amCharts 报表(转)
amCharts 是基于Flash的一套图表解决方法,界面比JFreeChart华丽很多,而且可以与用户交互,动画效果非常漂亮.官网:http://www.amcharts.com About AmC ...
amcharts嵌入到flex中
amcharts是比较优秀的图表制作工具,它的效果是其他图表工具所无法比拟的.但是amcharts只给我们提示一组图表的控件,没有给我们良好的控制组件和其他的表现形式,但是flex却有丰富的组件可用, ...
统计图表导入word，用到echarts，highcharts，amcharts，jfreechart
功能介绍需求由来整理数据和图表,导入到一份规范化的word中准备工作需求并不是很明确,就先实现word导出,我采用的是freemarker 首先:搭建一个boot项目添加pom中的包 < ...
amcharts _ 2.7.6 实现动态数据展现
老版的amcharts是基于flash的,新版的是javascript实现的,同样amcharts 2.7.6支持页面动态数据展现. 以下是方法: 一.首先去http://amcharts.com/d ...

amcharts的使用

amcharts的使用相关推荐

最新文章

热门文章