使用js画图之饼图
更新时间：2015年01月12日 15:42:57 投稿：hebedich
这篇文章主要介绍了使用js绘制几何图形系列教程的绘制饼图篇,需要的朋友可以参考下
使用js画图之饼图
饼图是将一个圆分割为多个扇形。
样例：http://www.zhaojz.com.cn/demo/draw8.html
复制代码 代码如下:
//饼图
//dot 圆点
//r 半径
//data 数据（一维数组）
function drawPie(dot, r, data){
if(data && data.length > 0){
var accumulationAngleOfSlope = new Number(0); //累计偏移角度
var total = new Number(0);
var i = 0;
for(;i<data.length;i++){ //计算data的合计
total += data[i];
}
for(i = 0;i<data.length;i++){
var angle = new Number(360*data[i]/total).toFixed(3); //将data[i]/total转换为角度
//画一个扇形
drawSector(dot, r, new Number(angle), new Number(accumulationAngleOfSlope), true, Number(parseFloat(data[i]/total)*100).toFixed(3)+'%');
accumulationAngleOfSlope = accumulationAngleOfSlope+parseFloat(angle); //累计偏移角度
}
}
}
相关文章
javascript捕获窗口关闭事件有两种方法2009-07-07
这篇文章主要为大家详细介绍了Bootstrap中datetimepicker的使用方法，一款功能强大的日期选择控件，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
基数排序是一种根据数字位数的值,对整数进行排序的算法,本文主要介绍了JS实现基数排序的示例代码,具有一定的参考价值,感兴趣的可以了解一下2023-12-12
在网页上显示时间(年月日/时分秒),很多新手朋友都想实现这样的功能，本文整理了一些实用技巧，杀出来与大家分享，感兴趣的朋友可以了解下2013-01-01
由于在没有规划好的情况下写的这个代码，写的比较粗糙，也没有添加注释。 JavaScript代码和HTML完全分离；可以随意添加多个子div标签，自动扩展2009-07-07
这篇文章主要介绍了JS中Select下拉列表类(支持输入模糊查询)功能，代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友参考下吧2017-01-01
JSHint是一个社区驱动用来检测JavaScript代码中错误和潜在的问题以及执行团队的编码规范工具。它非常灵活,因此可以很容易地适应您特定的编码规则和你的代码执行环境。JSHint将永远保持开源的方式。2016-08-08
这篇本文主要给大家介绍了JavaScript era库的使用,使用 ora 这个 JavaScript 库可以在命令行应用程序中提供漂亮的加载状态提示,本文详细介绍如何使用该库,并结合多个例子演示其功能,需要的朋友可以参考下2024-02-02
这篇文章主要介绍了JS实现的tab页切换效果,涉及javascript基于事件响应动态操作页面元素属性相关操作技巧,需要的朋友可以参考下2018-12-12
这篇文章主要介绍了JavaScript中的伪数组用法及说明，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-02-02
最新评论