Leaflet Gesture Handling mit LeafletMapMarker verwenden: Unterschied zwischen den Versionen
Aus Wikizone
Steff (Diskussion | Beiträge) |
Steff (Diskussion | Beiträge) |
||
| Zeile 14: | Zeile 14: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | === | + | === Initialisieren === |
| + | Einschalten kann man das Modul in der Initialisierung der Karte mit der Option: | ||
gestureHandling: true | gestureHandling: true | ||
| − | + | ''' | |
| − | + | Beispiel:''' | |
| − | Beispiel: | ||
<pre> | <pre> | ||
var map = L.map("map", { | var map = L.map("map", { | ||
| Zeile 26: | Zeile 26: | ||
}); | }); | ||
</pre> | </pre> | ||
| − | |||
| + | '''In ProcessWire''' | ||
/site/modules/FieldtypeLeafletMapMarker/MarkupLeafletMap.js | /site/modules/FieldtypeLeafletMapMarker/MarkupLeafletMap.js | ||
| − | + | ''' | |
| − | Sieht das dann z.B. so aus: | + | Sieht das dann z.B. so aus:''' |
<syntaxhighlight lang="javascript"> | <syntaxhighlight lang="javascript"> | ||
this.init = function(mapID, lat, lng, provider) { | this.init = function(mapID, lat, lng, provider) { | ||
Version vom 21. Februar 2019, 17:48 Uhr
Wir erweitern das LeafletMapMarker Modul direkt. Es wird ohnehin nicht weiterentwickelt. Daher werden wir es früher oder später eh selbst pflegen.
Modulerweiterung
Gesture Handling ins Modul kopieren
dist Ordner als
modules/FieldtypeLeafletMapMarker/assets/Leaflet.GestureHandling
speichern
CSS und JavaScript einbinden
<link rel="stylesheet" href="'.$config->urls->siteModules.'FieldtypeLeafletMapMarker/assets/Leaflet.GestureHandling/leaflet-gesture-handling.min.css" type="text/css">
<script src="'.$config->urls->siteModules.'FieldtypeLeafletMapMarker/assets/Leaflet.GestureHandling/leaflet-gesture-handling.min.js"></script>
Initialisieren
Einschalten kann man das Modul in der Initialisierung der Karte mit der Option:
gestureHandling: true
Beispiel:
var map = L.map("map", {
center: [-25.2702, 134.2798],
zoom: 3,
gestureHandling: true
});
In ProcessWire
/site/modules/FieldtypeLeafletMapMarker/MarkupLeafletMap.js
Sieht das dann z.B. so aus:
this.init = function(mapID, lat, lng, provider) {
if(lat != 0) this.map = L.map(mapID, {
center: [lat, lng],
zoom: this.options.zoom,
scrollWheelZoom: this.options.scrollWheelZoom,
gestureHandling: true
} );
L.tileLayer.provider(provider).addTo(this.map);
