Comments (7)
Possibly we need touch-action: none, too.
from d3-brush.
The only thing that we’re missing here is that we’re calling nopropagation
on touchstart rather than noevent
, and that’s due to d3/d3-drag#9. But as long as the user isn’t trying to support clicking and brushing simultaneously, it should be safe to noevent
on touchstart and thus prevent scrolling. Brushing is essentially unusable on touch devices now, so I think we must start there.
from d3-brush.
as long as the user isn’t trying to support clicking and brushing simultaneously
It seems like that works, though. You can listen to click events as long as the click gesture didn’t have any effect on the brush (e.g., clicking on the background when the brush is empty, or clicking on the brush but not moving during click).
That means we might want to take the more conservative route and only preventDefault on mousedown for touch devices.
from d3-brush.
I must be missing something here: d3-drag also does not preventDefault on touchstart or mousedown, but it works on iOS.
from d3-brush.
I’ve isolated the issue: it’s because for d3-brush, the touchmove listener isn’t registered until touchstart, whereas for d3-drag and d3-zoom, the touchmove listener is registered once ahead of time. 🤦♂
https://observablehq.com/d/e3dc7fb1297975f8
from d3-brush.
Some history, since I was curious. d3.brush previously registered the touch listeners statically; they were switched to transient listeners in d3/d3@6ef0eda. Prior to that, d3.brush registered listeners statically on the window! That was removed in d3/d3@ec12de6. d3.drag adopted static touch listeners in d3/d3-drag@9496742. d3.zoom appears to have always used static touch listeners since the first commit, d3/d3@2d98bf1.
from d3-brush.
It works properly if brush is applied to the <svg>
element, but <g>
element.
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.