Add touch support #2
Comments
|
Hello Jacob, I'm using your code for a project which I'm currently building for the iPad, so I added some "hacky" touch support. It's not perfect, but works for me. (I'm using it for drawing polygons only so far....) Maybe that could work as a starting point for you. Cheers and thanks for your work! Marcus |
|
Awesome! Thanks for that @mphasize. Your code will be a good start. I'll hopefully get the time within the next month of so to add support for the rest of the shapes/markers. |
|
Had some time to do it myself . :-) See https://github.com/jacobtoye/Leaflet.draw/pull/5 |
|
+1 is touch polygon drawing on the horizon? |
|
Honestly not at this stage. :( |
|
Alas... I actually have sufficient impetus to work on this today, assume the solution isn't simply a case of binding ~touchClick events then? Before I take a look, are there some design issues I should consider? |
|
Yeah I wish it were that easy :( unfortunately we would need to redo most if the handlers. Check out my responses to the pull request referenced above. Let me know what you think. |
|
Could I possibly request two things if you're not planning to implement this at present? Firstly, could you look at disabling the buttons on mobile devices? Secondly, could you make it clear in your front page on Github that it isn't available on mobile? Just for the sake of clarity, you know... Both would be much appreciated! |
|
Hi jacobtoye & philipn, first of all, great work!! I'd like to know, if I want iPad support today, what is the easiest hack I can apply? Thanks! |
|
@thejae your best bet is to check out what this pull was doing and try apply it to a fork. It will be quite a bit of work :( |
|
@jacobtoye Thanks for your reply :) do you accept donations in exchange for feature requests? If yes, what kind of donations are we speaking about for Touch support? |
|
@jacobtoye This plugin is fantastic! I'd also be interested in knowing how much time and money it'd take to complete this work, as we may be able to sponsor a bit. |
|
Thanks! @mphasize - do you have any plans to dive back into this work? |
|
@philipn Hej Philip, I don't have any immediate plans to get back to this, although I might need the touch support myself for a little side project next year. Just a few things to think about: Bigger touch targets for the handles and as a result of this coping with the problem of overlapping handles. Easy adjustment and repositioning of all handles even while drawing the shapes (since we have more than one finger, we should be able to use them). How to do exact positioning when the touch point is hidden behind your finger. How to deal with different screen sizes from phone to tablet and so on. Cheers! |
|
+1 for touch support :) I looked at pull 5 and am dismayed that it apparently (?) no longer works for master branch. It seems like Polygon will be easier to implement (well, elegantly anyway) so if I find the time I'll effort that... |
|
Here is my work-in-progress. Basic touch support for Polyline/Polygon seems to be working in my application. h/t @mphasize |
|
Hey @pztrick , against all odds, your solution works really fine on my friend's Windows phone as well. Thanks a million! |
|
@sellonen It looks like a recent Chrome update vanquished my fix. I'll probably get to fixing it today or tomorrow if it's easy enough. (Still working in IE11.) Just FYI in case you are using it! |
|
Thanks for keeping me updated. My need will in fact only materialize in about a month. Markers are by far the most important in our product, and I think I will make a slightly different implementation for touch users: When the drawing starts, a marker is placed in the middle of the map with a popup saying "Drag the map until I'm at the correct location, and then click ok". The marker stays in the middle while map is being dragged, of course. I think that will be easier for touch users, who otherwise cannot see a marker until they have clicked on the map and then drawing finishes already... Also it's quite easy to accidentally produce a click event on the map on touch devices, so I don't think binding anything to it will be a good idea. Though this experience is with a bit older phones and openlayers, i have not tested modern tools. |
|
Panning is a neat idea. Good luck! |
|
I developed my webapplication specifically with leaflet and leaflet.draw because leaflet has a good support for mobile devices. I wasn't aware that leaflet.draw didn't support touch events :-( My workaround is to use the Dolphin browser, the only browser on Android in which my webapplication works the same as on my laptop/desktop. My webapplication doesn't work in FireFox and Chrome or Chroma Beta (I didn't test Opera because Dolphin works ok) Hopefully leaflet.draw will get native touch support so that it will work in all mobile browser. BTW I use geoJSON with polygon's, polylines and points/markers in combination with a non-real-world background, and accuracy is not very important in my case. It's a kind of a rough map sketch tool |
|
Thank you for all your work @michaelguild13, your fork saved me! |
|
Thanks Jean! I've been meaning to update this lib with the one on ng's On Monday, August 24, 2015, Jean-Samuel Aubry-Guzzi <
Michael Guild |
|
@michaelguild13 Can you please list the changes that should come with the updated version? |
|
@MeiRct , right now I am trying to get the code that I built for the mapmaker project so I can update this repo with the latest. But I currently no longer work for natgeo so there's that. For now, I am just going to go though this chat and trouble shoot what I can. |
|
@michaelguild13 I've been using your code for a while now, thank you a lot. However, windows phones sometimes send 'touchcancel' and 'touchleave' events, causing on error in the Leaflet function L.DomEvent.AddPointerListener ( https://github.com/Leaflet/Leaflet/blob/stable/src/dom/DomEvent.Pointer.js#L20 ) I could overcome this by editing that function directly in Leaflet, but I'd rather not do it, not least because of the changes coming up in leaflet-1.0. Could we somehow treat touchcancel and touchleave as touchend events directly in Leaflet.draw? That way I wouldn't have to create a fork of my own for Leaflet. |
|
If your report a bug, I'll do a fix for it. On Monday, September 14, 2015, sellonen [email protected] wrote:
Michael Guild |
|
Do you mean "raise an issue"? I'm probably a bit noob with github, but there is no "issues" section in your fork of Leaflet.draw. |
|
haha, you're right...weird... On Mon, Sep 14, 2015 at 7:43 AM, sellonen [email protected] wrote:
Michael Guild |
|
@michaelguild13 any chance of getting that issue queue going for your fork? P.S. Great work on getting touch support. |
|
@sellonen , What's your fix for the windows phone? To play it safe, might change the code up so touchleave or touchcancel are treated the same as touchend. L.DomEvent.on(this._container, 'touchcancel', this._onTouchEnd, this); |
|
Hi, because I have never really looked at the code of Leaflet.Draw and didn't feel comfortable editing it, I resorted to making small modifications to Leaflet itself. Here's what worked: sellonen/Leaflet@0f7760b Let me know if an update to your Leaflet.Draw renders my hack unnecessary. |
|
@michaelguild13 I don't have a windows phone either. My point about the issue queue was so we could ask other questions relating to your fork, instead of asking them all in this one thread! :) |
|
I can test Windows phone 8 if you publish a demo. And I agree, this discussion should take place somewhere else... |
|
Ok, so I am an idiot and didn't realize that I had issues setting turned off on this repo. Anyhoo, Also, if you want to work with me on this, please feel free to do pull requests. |
|
@michaelguild13 What is the end goal of the fork? are you intending to create a pull request at some stage? |
|
@michaelguild13 you're no idiot in my book, you've done some great work making an already good library work on a trending platform (mobile) and you should commended! |
|
Just saw #285, never mind. :) Good work by the way! |
|
@omeid , I tried doing a pull request a few years ago and they didn't want to accept it, stating that they wanted me to create another class for only touch instead of integrating it as I have. If they want it, I am more than happy for them to take it. Also, I haven't been that active on this due to working more in react as of late. |
# This is the 1st commit message: checking distance to last point fixes; touch event still appears to be firing twice on IE change gitignore so we can deploy git repo add touch blocker block touch when touch has already begun touch events and log browser.touch typo dont show tooltip text for touch move browser touch check to disable showlength try timeout approach debugging intersections try different distance method alternate method of distance calculation another approach to distance function for approaching close distance lower threshold for finishing shape and log prevent L.browser unbinding issue # This is the commit message #2: remove conditional application of event handlers and onMouseMove call from onTouch
|
is this folk working with the latest version of leaflet right now? |
|
Most likely not. I've given up supporting this fork since I've been busy on other projects. |
|
This issue still exists on version 1.0.4. Thankfully @michaelguild13 fork still works but with warnings though. |
and others
Methodology of drawing doesn't work at all for touch browsers :|
The text was updated successfully, but these errors were encountered: