D3.js arc.padAngle()函数

D3.js库中的arc.padAngle()函数用于将圆弧的填充角度设置为指定的数字。此函数为某些填充圆弧设置相邻圆弧之间的角度。

句法：

arc.padAngle([angle]);

参数：此函数接受如上所述和下文所述的单个参数。

• 角度：这需要一个与弧的填充角度相对应的数字。

返回值：此函数不返回任何内容。

示例 1：

HTML

  

    
    
  
    
    
    

  

    
        
            
                GeeksforGeeks
            
            
                arc.padAngle()
            
        
        
        
    
      
    
        var svg = d3.select("svg")
            .append("g")
            .attr("transform", "translate(150, 100)");
  
        // An arc will be produced
        var arc = d3.arc()
            .outerRadius(20)
            .innerRadius(90)
            .startAngle(5)
            // Use of arc.padAngle() Function 
            .padAngle(.5)
            .endAngle(0.5);
  
        svg.append("path")
            .attr("class", "arc")
            .attr("d", arc);
  
        let p = document.querySelector(".arc");
        p.style.fill = "green";
    

  

输出：

示例 2：

HTML

  

    
    
  
    
    
    

  

    
        
            
                GeeksforGeeks
            
            
                arc.padAngle()
            
        
        
        
    
  
    
        var svg = d3.select("svg")
            .append("g")
            .attr("transform", 
                "translate(150, 100)");
  
        // An arc will be produced
        var arc = d3.arc()
            .outerRadius(30)
            .innerRadius(100)
            .startAngle(10)
            // Use of arc.padAngle() Function 
            .padAngle(12)
            .endAngle(12);
  
        svg.append("path")
            .attr("class", "arc")
            .attr("d", arc);
  
        let p = document.querySelector(".arc");
        p.style.fill = "green";
    

  

输出：