Avoid pan and zoom of embedded OSM maps in Wordpress - wordpress

I have several embedded maps on my website. The source of these maps are from....
Plugin WP GPX Maps
uMap (iframe)
I want to avoid panning and zooming when swiping with one finger on smartphone. Panning and zooming should be only possible by using two fingers.
Accordingly using a computer dragging and zooming should be only possible by pressing the CTRL-key when using the mouse.
Is there a plugin for Wordpress or a code for css or functions.php to realise this?

You can use the leaflet map plugin and set dragging to false and keep touchZoom on true.
See also: https://stackoverflow.com/a/41631385/288568

Related

Customized Website with Image zoom instead of scrolling

I have been searching google and I'm unable to find a website builder that offers such a feature.
So basically what I want is:
Initially on website load a certain zoomed out image is presented to the user and as the user scrolls down (through his mouse/touchpad) certain parts of the image are zoomed in one by one. Instead of the usual scrolling down a page, the scrolling down would instead zoom in on parts of an image, if that makes sense? Is this possible to do somehow?

Google Maps API - Customising the Appearance of certain controls

We're using the Google Maps API and have noticed that the appearance of some of the controls have changed recently. For example the size of the zoom controls:
and the map type:
appear to have increased in font size. We've also noticed this icon in the bottom right corner above the zoom controls:
and not sure what this is and would like to hide this if possible. Is it possible to reduce the size of the zoom controls and the Map Type text, as well as remove this person icon?
It turns it was an issue with the latest 3.34 release of the Google Maps JavaScript API. I've managed to revert to the previous version for now, e.g. http://maps.google.com/maps/api/js?v=3.33&key=xxxxxxx

Looking for ctrl zoom functionality

I'm using Here Maps, and I was wondering if there was a way to lock the zooming unless I'm ctrl + mouse wheel zooming.
When scrolling through the page, sometimes the mouse is over the map. This makes it so the map accidentally zooms in or out of the map depending on the direction of the mouse wheel scroll. I don't want that to happen!
I know that Google Maps has this functionality. I was wondering if Here Maps has the same functionality as well.
This is currently not supported by the JavaScript API but an interesting functionality. It is certainly something that we should have on the radar and will add it to the backlog.

Vectors moving and zooming while multitouch event with OpenLayers and Google Layer

I'm using OpenLayers with Google Layer, and I have a strange behaviour about vectors on the map.
On mobile (Android), when doing a multitouch event on the map (zoom), vectors move and zoom as the touchmove event is active. But when the touchend event is trigger, vectors are refresh at the right place and with their real size.
This is not happening with OpenstreetMap layer. I also tested some web pages implementing OpenLayers & Google Layer & a vector layer on my mobile, and they all have the same issue. Any idea why ?
I tested this one, if someone want to reproduce : http://www.macfh.co.uk/Test/Google_with_OpenLayers.html With a multitouch event, marker is moving/zooming, and then go back to its initial place.
I already took care about the sphericalMercator specifity, so I think it's not the problem.
Thanks in advance !
Tiles positionning for google layers is done through their api, which doesn't allow to make pinch zoom work the same way it’s done for all others layers: Pinch zooming doesn't work with google layers.
If you want pinch zoom to work, you should consider using layers with direct access to tiles (OSM, Bing, …). And your mobile will thank you for the decrease of number of scripts to load ;).

How to show a Drupal Openlayers map in a colorbox?

We've been working on a project to show bus routes in a grid and have each column header link to the corresponding location on a map. We're on Drupal 6 and already have both the Colorbox and OpenLayers modules installed. I've been able to display a map inside a node using the CCK OpenLayers WKT field.
Ideally, this would use a colorbox that would appear with embedded OpenLayers map. Is there a best way to have a link open a colorbox instance with the appropriate map embedded? If the map is a node, is there a best way to show just node content inside a colorbox?
Any help would be appreciated. We've played with some things, but just haven't really found a good way of accomplishing this yet.
What we've done in a similar scenario (popping up a video in Colorbox) was to create a page.tpl.php override file specific to that content type with everything stripped out, except for the content we want displayed in the lightbox.
The other thing I found is that if you make the map layer default to fullscreen, it fills the colorbox

Resources