Mouse Wheel Zoom bei OSM deaktivieren

Concilla

Mitglied
Hallo an alle, ich habe bei Codepen eine Map gefunden, die ich gern auf einer Seite integrieren möchte. Und zwar, diese:

Leaflet Worldvious bei Codepen

Die Anpassunge bezüglich der Standorte, die ich eintragen möchte, hat auch gut funktioniert. Leider weiß ich nicht, wie man das Zoomen per Mouse Wheel deaktiviert, unterbindet. Denn wenn die Map sich am Anfang einer Seite befindet, über die volle Breite, und man möchte nach unten scrollen, dass zoomt nur die Karte.

Ich würde mich sehr freuen, wenn mir hier jemand helfen könnte? Vielen Dank schon mal im Voraus.

Concilla
 

Concilla

Mitglied
Ich habe es! :) Vielen Dank. Jetzt funktioniert es.

Code:
 React.createElement(LeafletMap, { center: position, zoom: this.state.zoom, scrollWheelZoom:false }, /*#__PURE__*/

Gern würde ich noch eigene Marker anstelle der Blauen einfügen. Aber auch das bekomme ich nicht hin :-(
 

Sempervivum

Erfahrenes Mitglied
Keine Ahnung von React aber auch hier findet man bei Stackoverflow die Lösung:
Ein Icon-Objekt erzeugen:
Code:
                 myIcon = L.icon({
                    iconUrl: 'https://webentwicklung.ulrichbangert.de/images/bild1.jpg',
                    iconSize: [64,64],
                    iconAnchor: [32, 64],
                    popupAnchor: null,
                    shadowUrl: null,
                    shadowSize: null,
                    shadowAnchor: null
                });
Und beim Marker verwenden:
Code:
        <Marker icon={myIcon} position={[users[0].lat, users[0].lng]}>
Hier mit einem sinnfreien Testbild:
https://codepen.io/Sempervivum/pen/RwKmLWP
 

Concilla

Mitglied
Herzlichen Dank, Sempervivum. Jetzt funktionieren auch die eigenen Marker :) Auch das Popup konnte ich aktivieren. Danke für die Hilfe!