Как изменить иконку ранее нажатого маркера на угловых картах Google - PullRequest
Новая
       14

Как изменить иконку ранее нажатого маркера на угловых картах Google

0 голосов
/ 16 октября 2018

Мне удалось изменить значок маркера, на который нажали в данный момент, используя код ниже.У меня есть несколько маркеров на странице.Теперь проблема заключается в том, что, если я щелкну по второму маркеру, значок ранее нажатого маркера должен быть заменен на исходный (inactive.png), а значок текущего нажатого маркера должен использоваться (active.png). Как можно добитьсяэтот?Пожалуйста, помогите.

В приведенном ниже коде, если m.isClicked имеет значение true, тогда используется inactive.png, в противном случае используется active.png. 

<agm-marker *ngFor="let m of mapArrayList" (markerClick)="clickedMarker(infowindow, m)"
    [latitude]="m.geometry.location.lat()" [longitude]="m.geometry.location.lng()" 
    [iconUrl] ="
      {
        url: m.isClicked ? './assets/images/marker_inactive.png' : './assets/images/marker_active.png',
        scaledSize: {
            width: 40,
            height: 60
        }
    }">




 clickedMarker(infowindow, m) {
        m.isClicked = false;   // once the marker is clicked, the icon of marker changes from inactive.png to active.png
        if (this.previous) {
    // this is to close the previously opened infowindow.
          this.previous.close();
        }
        this.previous = infowindow;
      }

1 Ответ

0 голосов
/ 16 октября 2018

Вместо логического значения в вашем компоненте может быть переменная, хранящая выбранный индекс (или идентификатор элемента, если он у вас есть), и проверка, если index === this.selectedIndex, вы можете установить значок активным или отключенным. 

url: index === this.selectedIndex ? './assets/images/marker_active.png' : './assets/images/marker_inactive.png',
...