как вызвать функцию внутри карты, используя свойства маркеров - PullRequest
Новая
       1

как вызвать функцию внутри карты, используя свойства маркеров

0 голосов
/ 18 сентября 2018

Я пытался загрузить какое-то место на маркер, и он загружается правильно. Теперь я хочу вызвать функцию, когда я нажимаю на маркер. Я реализовал функцию следующим образом. 

loadMap(clat, clon) {
let latLng = new google.maps.LatLng(clat, clon);

let mapOptions = {
  center: latLng,
  zoom: 15,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}

this.map = new google.maps.Map(this.mapRef.nativeElement, mapOptions);
new google.maps.Marker({
  position: new google.maps.LatLng(clat, clon),
  map: this.map,
  animation: google.maps.Animation.DROP,
  icon: {
    path: google.maps.SymbolPath.CIRCLE,
    scale: 7,
    strokeColor: '#0057ff'
  }
});

var infowindow = new google.maps.InfoWindow();

var marker, I;

this.sellers.forEach(element => {
  console.log("where am i:" + element.location.la)

  marker = new google.maps.Marker({
    position: new google.maps.LatLng(element.location.la, element.location.lo),
    map: this.map
  });
  google.maps.event.addListener(marker, 'click', (function (marker, i) {
    return function () {
      infowindow.setContent(element.name + '<button ion-button (click)="{{test}}">Vist Shop</button>');
      infowindow.open(this.map, marker);

      this.type = element.sellertype;
      this.selectShopType(this.type)


    }
  })(marker, i));

});


}

В этой функции я вызываю функцию selectShopType (), но получаю сообщение об ошибке

selectShopType () не является функцией

. Как я могу вызвать внешнюю функцию, используя свойства маркера

Ответы [ 2 ]

0 голосов
/ 05 июня 2019

Вы можете использовать функцию ниже, которую я использовал 

this.map.addMarker(options).then((marker: GoogleMapsMarker) => {
         marker.addEventListener(GoogleMapsEvent.MARKER_CLICK)
        .subscribe(e => {
          console.log(“you clicked me");
          //implement the function 
               });
          });
0 голосов
/ 18 сентября 2018

У вас нет функции selectShopType, поэтому вы должны добавить эту функцию в область видимости верхнего уровня 

function  selectShopType(myvalue){

    alert('My value is : ' + myvalue);
    return;
}

loadMap(clat, clon) {
    let latLng = new google.maps.LatLng(clat, clon);

    let mapOptions = {
        center: latLng,
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    this.map = new google.maps.Map(this.mapRef.nativeElement, mapOptions);
    new google.maps.Marker({
        position: new google.maps.LatLng(clat, clon),
        map: this.map,
        animation: google.maps.Animation.DROP,
        icon: {
            path: google.maps.SymbolPath.CIRCLE,
            scale: 7,
            strokeColor: '#0057ff'
        }
    });

var infowindow = new google.maps.InfoWindow();

var marker, i;

this.sellers.forEach(element => {
    console.log("where am i:" + element.location.la)

    marker = new google.maps.Marker({
        position: new google.maps.LatLng(element.location.la, element.location.lo),
        map: this.map
    });
    google.maps.event.addListener(marker, 'click', (function (marker, i) {
        return function () {
        infowindow.setContent(element.name + '<button ion-button (click)="{{test}}">Vist Shop</button>');
        infowindow.open(this.map, marker);

        this.type = element.sellertype;
        selectShopType(this.type);


    }
})(marker, i));

});

}
...