Brush with handle about d3-brush HOT 4 CLOSED

The example you’ve linked uses the v3 API. The structure of the brush changed in v4, as documented in the README. You can still add custom elements to the brush, but you should add them to the brush element itself, rather than adding it to the handle element. In addition, in v4 you are responsible for repositioning your handle whenever the brush moves (typically by listening for brush events); you can no longer rely on the brush moving custom handle elements for you. For interaction, you must also bind a data object with the appropriate type field (e.g., {type: "e"} for a left-edge handle) to any custom elements you add to the brush.

from d3-brush.

Here's a d3 v4 port of Mike's block
http://bl.ocks.org/Fil/013d52c3e03aa7b90f71db99eace95af

Bottom line: everything has changed.

• extent() doesn't mean the same thing as before
• getting the current values is different (you need to read it from the node that contains it, it's not in the brush itself anymore. Because a brush is now a factory that you apply to a selection (similar to d3.axis).
• I couldn't see how to pass a scale, and had to apply it myself (am I missing something?)
• you effectively need to move and possibly hide/show the handles yourself during the brush event

This was certainly the most difficult port to d3 v4 I've done.

from d3-brush.

Prodded by @Fil, I have updated my own example to v4. http://bl.ocks.org/mbostock/4349545

from d3-brush.

Thank you.

from d3-brush.