The d3.brush() function in D3.js is used to new create a 2-D brush. The brush is generally created SVG element.
Syntax:
d3.brush();
Parameters: This function does not accept any parameters.
Return Value: This function returns a newly created brush.
Example: In this example, we will create a brush of size 600×600 pixels on an SVG element using this method.
HTML
<!DOCTYPE html> <html> <head> <title> D3.js | d3.brush() Function </title> <script src = </script> </head> <body> <svg width=600 height=600 id="brush"></svg> <script> // Selecting SVG element d3.select("#brush") // Creating a brush using the // d3.brush function .call( d3.brush() // Initialise the brush area: start at // 0,0 and finishes at given width,height .extent( [ [0,0], [600,600] ] ) ) </script> </body> </html> |
Output: The brush is created successfully, you can drag to create rectangles using this brush.
Reference: https://devdocs.io/d3~5/d3-brush#_brush
