D3.js arc.padRadius()函数

d3.padRadius()函数用于设置圆弧中的焊盘半径。如果提供了焊盘半径，则它将焊盘半径设置为指定的函数或数字并返回此弧生成器。

如果没有提供半径，则返回当前的焊盘半径访问器，默认为空，表示焊盘半径自动计算为 sqrt(innerRadius * innerRadius + outerRadius * outerRadius)。焊盘半径计算分隔相邻圆弧的固定线性距离，定义为 padRadius * padAngle。

句法：

arc.padRadius([radius])

参数：此方法接受如上所述和如下所述的单个参数：

• radius ：焊盘半径的值。

Return ：它返回具有指定焊盘半径的圆弧。

示例 1：

HTML

 

    
    
 
 
    
    

 

    
        
           
   
            
                d3.arcpad()
             
   
        
         
        
        
    
 
    
        var svg = d3.select("svg")
            .append("g")
            .attr("transform", "translate(150,50)");
 
        // padding radius =10
        var arcpad = d3.arc()
            .innerRadius(48)
            .outerRadius(50)
            .padRadius(10)
            .startAngle(90)
            .endAngle(2 * 180);
 
        svg.append("path")
            .attr("class", "arc")
            .attr("d", arcpad)
            .attr("fill","red");
    

 

输出 ：

示例 2：

HTML

 

    
    
 
 
    
    

 

    
        
           
   
            
                d3.arcpad()
             
   
        
         
        
        
    
 
    
        var svg = d3.select("svg")
            .append("g")
            .attr("transform", "translate(150,50)");
 
        // padding radius =5
        var arcpad = d3.arc()
            .innerRadius(48)
            .outerRadius(50)
            .padRadius(5)
            .startAngle(10)
            .endAngle(5);
 
        svg.append("path")
            .attr("class", "arc")
            .attr("d", arcpad)
            .attr("fill","red");
    

 

输出 ：