Как определить несколько пользовательских значков в Leaflet? - PullRequest
Новая
       5

Как определить несколько пользовательских значков в Leaflet?

0 голосов
/ 14 марта 2020

Я попытался добавить пользовательские значки на карту Leaflet. 

<% for (let a=0; a<pointers.length; a++) { %>

  switch ("<%-pointers[a].department%>") {
    case "departmentX":
      L.marker([<%-pointers[a].geolocation%>]);
      var icon = L.icon({iconUrl: '/img/photo1.png'});
      break;
    case "departmentY":
      L.marker([<%-pointers[a].geolocation%>]);
      var icon = L.icon({iconUrl: '/img/photo2.png'});
      break;
    default:
      L.marker([<%-pointers[a].geolocation%>]);
      var icon = L.icon({iconUrl: '/img/photo3.png'});
  }

  L.icon({
      iconSize:     [38, 95],
      popupAnchor:  [-3, -76]
  });

  L.marker([<%-pointers[a].geolocation%>], {icon: icon}).addTo(mymap).bindPopup( "<%-<h1>pointers[a].name%></h1>");

<% } %>

Правильные значки размещаются в нужном месте, когда я загружаю карту в браузере. Однако IconSize и popupAnchor игнорируются. Есть ли возможность заставить IconSize и popupAnchor работать, не добавляя его в каждый случай в операторе switch?

1 Ответ

0 голосов
/ 15 марта 2020

Вы можете создать свой собственный значок, добавив L.icon

var myIcon = L.Icon.extend({
    options: {
      iconSize:     [38, 95],
      popupAnchor:  [-3, -76]
    }
});

Затем используйте myIcon, например: 

var icon = new myIcon({iconUrl: '/img/photo1.png'});
...