Join GitHub today
GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together.Sign up
Swiping with followTouchMove broken (at least on touchscreen devices) #6597
There is a slight movement of the chart at the start of the single-fingered swipe, then it stops and the tooltip follows the touch point. The first swipe may be OK, but if you swipe left, then lift finger, then swipe right, lift, and repeat, soon you will (should) find that there is a slight movement of the chart at the start of the swipe.
Not only is this very confusing for the user (particularly where the chart moves some distance... seems to jump more than smooth-pan), but also the active touch position (shown by a crosshair) is displaced from the active points on the line.
The effect is even more pronounced having zoomed in, and then doing a single-fingered swipe... chart is very jumpy (should be fixed).
Furthermore, after having zoomed in and panned around a bit, hitting the Reset Zoom button seems to restore behaviour to what it should be... i.e. the chart is fixed steady and swiping with one finger moves the tooltip nicely... even after zooming in again. So this may point to a possible fix.
If this is identified as a bug that will be fixed in the next version, it would be nice to have a workaround in the meantime to restore sensible behaviour to the existing code.
(Another observation: in my production code -- I can't reproduce this in the simple jsfiddle -- I'm also finding that during a zoom operation the lower half of the vertical (x axis) gridlines disappear... then restore on releasing the zoom. In fact even with zoom and pan disabled, and with
Live demo with steps to reproduce
embedded version (good for mobile browser): http://jsfiddle.net/56Lrv824/4/embedded/result/
non-embedded version: http://jsfiddle.net/56Lrv824/4/
As mentioned above, hitting the Reset Zoom button after zooming/panning seems to fix the problem thereafter. And so does disabling pan and zoom altogether (though this isn't really an ideal workaround):
At least Chrome on an Android device. My mobile Chrome version is 57.0.2987.132 but I doubt it's particularly version-specific.
Thanks for reporting!
None of this happens in iOS, as far as I can see. Tested in Safari and Chrome. I reproduced it on Android/Chrome in BrowserStack though. It probably has to do with the different handling of touch and mouse events on iOS vs Safari.
@TorsteinHonsi glad you were able to reproduce this. Is there a quick-fix workaround (other than disabling pan and zoom)... or do I just need to have a bit of patience? :-)
Also, slightly confused as I thought that setting
Ah thanks @TorsteinHonsi . The reason I wanted to get a simple example working is that I'm finding that on a touch screen the behaviour also isn't very satisfactory with
I find that it's very difficult to get a tooltip to pop up cleanly and reliably with this combination. Often the tooltip doesn't pop up and all with a tap on or near a point. Sometimes it pops up briefly and vanishes. With zoom/pan disabled it's fine, so I suspect that a touch event is often accompanied by a slight movement (rolling of the finger), and that slight movement is enough to fool the UI into thinking that the user is panning rather than just touching?
The following two variants show it very clearly for me... again I'm on Android + Chrome:
(jumpy, unreliable tooltip, horrible UI experience)
(reliable tooltip, but no zoom and pan)
I'm not sure whether this is related to the original issue I reported, or whether it's separate.
If you can't reproduce this, I can maybe post a video capture to show what I mean?
added a commit
Apr 27, 2017
I had hoped that it would also fix the secondary issue I reported in this comment: https://github.com/highcharts/highcharts/issues/6597#issuecomment-296606787 (where
But I still find that the UI experience is not very good with
I think it is probably less of a bug more more of a sensitivity issue... what I find is that in order for the tooltip to show (and stay showing) you have to be very careful how you touch on the screen... you have to have a very stable and light touch, since even the slightest sideways movement or roll of the finger as you touch the screen seems to cause the tooltip to disappear... it flashes up then away again almost straight away, which isn't a nice UI. Presumably the gesture is first considered to be a touch event (tooltip flashes up) and then almost immediately is considered instead to be a pan event (tooltip disappears and chart moves just very slightly).
Is there any way in which the sensitivity can be altered, or a threshold added, so that with