D3.js path.lineTo()函数

path.lineTo()函数用于从当前点集绘制一条线到给定点。

句法：

path.lineTo(x, y);

参数：它需要两个参数，如上所述，如下所述。

• x：它是要绘制线的点的 x 位置。
• y：它是要绘制线的点的 y 位置。

返回值：不返回任何值。

示例 1：从 (0, 0) 到 (100, 100) 画一条线。

HTML

  

    
    
  
    
    
      
    
        h1 {
            color: green;
        }
  
        svg {
            background-color: #f2f2f2;
        }
  
        .path2 {
            stroke: #000;
        }
    

  

    
        GeeksforGeeks
        D3.js | Path.lineTo() Function
        
        Making a line from (0, 0) to (100, 100) 
        
            
        
    
      
    
  
        // Creating a path 
        var path = d3.path();
        path.moveTo(0, 0);
          
        // Making line to x:100 and y:100 
        path.lineTo(100, 100);
          
        // Closing the path 
        path.closePath();
        d3.select(".path2").attr("d", path); 
    

  

输出：

示例 2：使用 lineTo()函数制作正方形。

HTML

  

    
    
  
    
    
  
    
        h1 {
            color: green;
        }
  
        svg {
            background-color: #f2f2f2;
        }
  
        .path2 {
            stroke: #000;
        }
    

  

    
        GeeksforGeeks
        D3.js | Path.lineTo() Function
        
        Making a square using lineTo() function
        
            
        
    
      
    
  
        // Creating a path 
        var path = d3.path();
        path.moveTo(10, 10);
          
        // Making line to x:90 and y:10 
        path.lineTo(90, 10);
          
        // Closing the path 
        path.closePath();
        path.moveTo(90, 10);
          
        // Making line to x:90 and y:90 
        path.lineTo(90, 90);
          
        // Closing the path 
        path.closePath();
        path.moveTo(90, 90);
          
        // Making line to x:10 and y:90 
        path.lineTo(10, 90);
          
        // Closing the path 
        path.closePath();
        path.moveTo(10, 90);
          
        // Making line to x:10 and y:10 
        path.lineTo(10, 10);
          
        // Closing the path 
        path.closePath();
        d3.select(".path2").attr("d", path); 
    

  

输出：