D3.js linkHorizontal() 方法

d3.linkHorizo ntal() 方法返回一个带有水平切线的新链接生成器。它通常在根位于顶部/底部边缘且孩子向下/向上时使用。

句法：

var link = d3.linkHorizontal()
    .x(function(d) { return d.x; })
    .y(function(d) { return d.y; });

参数：此函数不带任何参数。

返回值：此方法返回一个新的链接生成器。

例子：

HTML

    
 
    
    

 

 
    
        GeeksforGeeks
    
 
    
        D3.js | linkHorizontal() Method
    
 
    
    
    
 
    
 
        var data = [
            {source: [100,25], target: [200,175]},
            {source: [100,25], target: [25,175]}];
       
        // Horizontal link generator
        var link = d3.linkHorizontal()
                .source(function(d) {
                    return [d.source[1], d.source[0]];
                })
                .target(function(d) {
                    return [d.target[1], d.target[0]];
                });
       
        //Adding the link paths
        d3.select("#gfg")
        .selectAll("path")
        .data(data)
        .join("path")
        .attr("d", link)
        .classed("link", true);
 
    

 

输出：