[OpenLayers-Dev] iPhone javascript events
Andrew Marks
atm at amrx.net
Tue Jul 13 20:01:39 EDT 2010
Hello,
I would like to start a discussion about the proper inclusion of
special iphone-safari javascript events into OpenLayers. I am
attempting to add touch pan and zoom support to OpenLayers and while I
am doing it, I might as well do it in a way that is correct and can be
used by others. I'll talk about what I have done what I plan to do. I
am working with 2.9.1 (maybe I should work with trunk?)
What I have done: (Made touch map panning work)
First I added "touchstart", "touchend", "touchmove" to BROWSER_EVENTS in
Events.js
I then had to modify OpenLayers.Events.getMousePosition because the
position information in the touch events is in a different location,
specifically under "targetTouches" or "changedTouches" in the event.
Here is the code, added just before original return statement of
getMousePosition:
if (evt.type.match(/touch/)) {
var touches = evt.targetTouches;
if (touches.length < 1) {
touches = evt.changedTouches;
}
return new OpenLayers.Pixel(
(touches[0].pageX + this.element.scrolls[0]) -
this.element.offsets[0]
- this.element.lefttop[0],
(touches[0].pageY + this.element.scrolls[1]) -
this.element.offsets[1]
- this.element.lefttop[1]
);
}
return new ...
I then added three methods to OpenLayers.Handler.Drag:
touchstart: function (evt) {
evt.button = 1; //Pretend to be a left click.
return this.mousedown(evt);
},
touchmove: function(evt) {
return this.mousemove(evt);
},
touchend: function(evt) {
return this.mouseup(evt);
},
And now touch panning is working.
What I plan to do next is look at gesture events, specifically pinching
to zoom in and out.
I welcome all feedback to ensure this is done correctly. If I am going
about it incorrectly, let me know.
Thanks for your time,
Andrew Marks
More information about the Dev
mailing list