使用js画图之饼图

2019-12-18,,,,

使用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); //累计偏移角度
        }
    }
}

您可能感兴趣的文章:

  • html+js+highcharts绘制圆饼图表的简单实例
  • javaScript矢量图表库-gRaphael几行代码实现精美的条形图/饼图/点图/曲线图
  • 轻松使用JSP生成饼图
  • JavaScript根据数据生成百分比图和柱状图的实例代码
  • 使用javascript获取flash加载的百分比的实现代码
  • javascript 计算两个整数的百分比值
  • javascript下正则匹配百分比的代码
  • Javascript highcharts 饼图显示数量和百分比实例代码

《使用js画图之饼图.doc》

下载本文的Word格式文档,以方便收藏与打印。