19 mar 2023

#shorts - dodanie data attribute do markera

Oj dawno mnie tutaj nie było 😉
Dzisiaj coś co ostatnio mi się bardzo przydało, a mianowicie dodanie data attribute do markera. Potrzebowałem kilka takich elementów.
A więc zacząłem od rozszerzenia funkcji divIcon.
Poniżej funkcja, która jest dość prosta. Używamy metody createIcon

const DataMarkers = L.DivIcon.extend({
  createIcon: function (oldIcon) {
    let divElement = L.DivIcon.prototype.createIcon.call(this, oldIcon);

    // w pętli dodajemy odpowiednie elementy do markera
    if (this.options.data) {
      for (let key in this.options.data) {
        divElement.dataset[key] = this.options.data[key];
      }
    }
    return divElement;
  },
});

L.dataDivIcon = (options) => new L.DivIcon(options);

export default DataMarkers;