Friday, 1 February 2019

Change marker text with button on Leaflet map

I have a map with markers, generated by a json file, that contain a text with numeric value. For markers generation I use the Beaufify Markers Plugin. This is a part of code that I'm using

var map = L.map('mapid').setView([43.08, 12.34], 9);

for ( var i=0; i < markers.length; ++i ) {
    options = {
      isAlphaNumericIcon: true,
      text: markers[i].temperatura,
      iconSize: [28, 28],
      borderColor: markers[i].color,
      backgroundColor: markers[i].color,
      innerIconAnchor: [0, 4],
      textColor: '#000;'
    };
    var popup = L.popup({
      pane: 'fixed',
      className: 'popup-fixed',
      autoPan: false,
    }).setContent('my html code');

    L.marker( [markers[i].lat, markers[i].lng], {
        icon: L.BeautifyIcon.icon(options),
        virtual: true
    })
    .bindPopup(popup)
    .addTo( map );
}

I would like the best and cleanest way, to change the variable text on options ('markers[i].temperatura'), with an onclick action on a button.



from Change marker text with button on Leaflet map

No comments:

Post a Comment