使用js画图之饼图
作者:bea
使用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)
使用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); //累计偏移角度
}
}
}
有用 | 无用
饼图是将一个圆分割为多个扇形。
样例: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和jquery实现设置和移除文本框默认值效果代码
- Nodejs学习笔记之NET模块
- javascript面向对象之访问对象属性的两种方式分析
- javascript面向对象之对象的深入理解
- jQuery实现设置、移除文本框默认值功能
- javascript面向对象快速入门实例
- javascript引用赋值(地址传值)用法实例
- jQuery实现拖动调整表格单元格大小的代码实例
- Nodejs学习笔记之Global Objects全局对象
- jQuery trigger()方法用法介绍
- 修改或扩展jQuery原生方法的代码实例
- JQuery.get提交页面不跳转的解决方法
- Nodejs为什么选择javascript为载体语言
- 15个jquery常用方法、小技巧分享
- js对象基础实例分析
- 浅谈nodeName,nodeValue,nodeType,typeof 的区别
- js使用心得分享
- js查找节点的方法小结
- 使用js画图之画切线