D3.js selection.transition()函数

D3.js中的selection.transition()函数用于获取具有指定名称的给定选择的新转换。新过渡仅与其他同名过渡独占。

句法：

selection.transition([name])

参数：此函数接受以下参数，如上所述和如下所述：

• name：这个参数是过渡实例。

返回值：此函数返回具有指定名称的给定选择的新转换。

下面的程序说明了D3.js中的selection.transition()函数。

示例 1：

 
 
 
    
     
    
      
    
        #GFG {
            height: 200px;
            width: 200px;
            background-color: black;
        }
    
 
       
 
    
         
            Geeksforgeeks 
         
         
        D3.js | selection.transition() Function
             
        
             
        
            d3.select("#GFG")
                .transition()
                .style("background-color", "red");
         
    
 

输出：

示例 2：

 
 
 
    
     
    
 
       
 
    
         
            Geeksforgeeks 
         
         
        D3.js | selection.transition() Function
             
        Click
  
        
          
              
          
        
             
        
            function triggerTransition(){
                d3.select("#rectArea")
                    .transition()
                    .delay(100)
                    .duration(2000)
                    .attr("width", "330")
            }
         
    
 

输出：