D3.js 画笔选择()函数

D3.js 中的d3.brushSelection()函数用于获取给定节点的画笔选择。

句法：

d3.brushSelection(this);

参数：

• this：用于获取当前画笔的边界。

返回值：此函数返回包含画笔元素边界的数组。

示例：在此示例中，我们将创建一个画笔并使用此方法获取其选择绑定边。

    
        
            D3.js | d3.brushSelection() Function
        
  
        
       
    
  
    
        
            Geeksforgeeks
        
  
        
            D3.js | d3.brushSelection() Function 
            Dimensions are:
        
  
        
  
        
        
            // Selecting SVG element
            d3.select("#brush")
                // Creating a brush
                .call(
                    d3
                        .brush()
                 // Calling a function on brush change
                        .on("brush", brushed)
  
         /* Initialise the brush area: start at 0, 0 
         and finishes at given width, height*/
                        .extent([
                            [0, 0],
                            [600, 600],
                        ])
                );
            function brushed() {
// Using d3.brushSelection to get bounds of the brush
                const sel = d3.brushSelection(this);
                console.log(sel);
                var p = document.getElementById("p");
                p.innerHTML = "side1 : " 
                  + sel[0][1] + `<br>` 
                  + "side2 : " + sel[1][1] 
                  + `<br>` + "side3 : " 
                  + sel[0][0] + `<br>`
                  + "side4 : " + sel[1][0] + `<br>`;
            }
        
    

输出：