Comments (4)
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.
Related Issues (20)
- Brush event started does not initiate "points" variable HOT 1
- Apparent breaking change(s) in non-breaking release HOT 3
- Can't create new brush selection inside extent, only change exsisting one HOT 1
- a brush transition is not interrupted HOT 1
- multitouch HOT 2
- FF android HOT 2
- Allow mousemove event triggering or switching brush state HOT 2
- brush.move should accept an event HOT 1
- Using brush for fine-grained zooming HOT 3
- Brush Wrapping
- bbnk,
- Error multitouch emit undefined inside move function HOT 8
- Brushing uses wrong mouse coordinates if perspective transformations are applied HOT 3
- Is it possible to update d3-color ? HOT 2
- Conflict trying to .filter() with a false value if there is also a d3-zoom active
- incorrect position of the selected area in firefox HOT 2
- Allow to change default to CENTER mode HOT 2
- Errors when using `filter` on mobile HOT 2
- Customize the brush style HOT 2
- Brush handles disappear at zero width HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from d3-brush.