Skip to content Skip to sidebar Skip to footer

Ionic/angular Leaflet Directive - Zoom In/out Buttons Do Not Work

I have some problems with default zoom in/out buttons on leaflet map. Everything works fine when I load page directly but when I change one state to state where leaflet directive i

Solution 1:

The solution was simple. Ionic was "eating" all click events which was not created by a framework. For the container of leaflet map there was a need to add attribute data-tap-disabled="true"

<ion-contentdata-tap-disabled="true"><leafletheight="480px"></leaflet></ion-content>

Solution 2:

Seems like ionic has a bug on the touch events handler. However, a colleague of mine came up with a workaround until it gets fixed.

Basically, use his version of ionic.bundle.js (https://rawgit.com/cachiconato/ionic/angular-leaflet-control/release/js/ionic.bundle.js) and add 'data-do-not-set-coordinates="true"' to each possible tag linking to the map.

http://codepen.io/anon/pen/sHpoy?editors=101

 <h2 data-do-not-set-coordinates="true">{{location.name}}</h2>

Post a Comment for "Ionic/angular Leaflet Directive - Zoom In/out Buttons Do Not Work"