时间戳

首页 > 解决方案 > 我可以使用传单修改事件上标记图标的 CSS（使其更大）吗

javascript - 我可以使用传单修改事件上标记图标的 CSS（使其更大）吗

问题描述

我实际上是在 Angular 服务中使用传单，我用这种方法生成我的标记图标：

  private getIcon(geoJsonPoint) {
if (geoJsonPoint.properties.actif_id) {
  const category = geoJsonPoint.properties.category.toUpperCase();
  const prioritie = geoJsonPoint.properties.priority.toUpperCase();
  const id = geoJsonPoint.properties.id;
  console.log(geoJsonPoint);
  const url = 'assets/images/' + category + '/' + prioritie + '.svg';
  return L.icon({
    iconUrl: url,
    className: id,
    iconSize: [58, 68],
    iconAnchor: [29, 68],
    popupAnchor: [0, -60]
  });

所以在传单事件（popupen）上，我想让我的图标更大而不设置新图标，但只能修改 css。传单允许这种事情还是有人已经这样做了？

谢谢帮助！

标签： javascriptangularleaflet

解决方案

我设法使用 L.DomUtil 和 setTransform 解决了它，如果它可以帮助任何人，我会在下面发布代码。我准确地说我想在 popupopen 事件上转换图标。

  private zoomIconOnPopupOpen(scale): void {
this.map.on('popupopen', (event1: any) => {
  let marker = event1.popup._source;
  if (marker._icon) {
    const pos = L.DomUtil.getPosition(marker._icon);
    L.DomUtil.setTransform(marker._icon, pos, scale);
  }
});
this.map.on('popupclose', (event1: any) => {
  let marker = event1.popup._source;
  if (marker._icon) {
    const pos = L.DomUtil.getPosition(marker._icon);
    L.DomUtil.setTransform(marker._icon, pos, 1);
  }
});

}

推荐阅读