2016-07-26 95 views
0

我想,當一個標記,用戶點擊,我想一個彈出式窗口,給他一些信息(例如:讓說的標記代表的位置,當他點擊一個標記它的顯示器給他這個位置的所有信息)流星 - 谷歌地圖標記點擊事件

這樣做最簡單的方法是什麼?

+0

很確定谷歌地圖會爲此類事情生成自定義事件。如果喲使用的反應,有(https://github.com/tomchentw/react-google-maps),其正常工作的[I用於GM NPM包],我認爲他們的例子之一是如何實現自定義點擊標記上的事件。 – CodeChimp

+0

,我只用流星(火焰在前端).. –

+0

不要只使用GMAPs開箱的 - 使用我的回答中提到的包,否則你會花時間重新發明輪子。該軟件包將處理所有加載訂單操作。 – NicholasByDesign

回答

0

查看您的標記物Google Maps文檔如何設置事件偵聽器。您應該可以在Blaze模板代碼中執行此操作,很可能是模板的onCreated()onRendered()

0

解決辦法是:

marker.addListener('click', function() { 
    swal({ 
     title: "More details", 
     text: "Type what you want here", 
     }); 
}); 

問候,

0

添加這個包https://github.com/dburles/meteor-google-maps

HTML

{{> googleMap name="map" options=mapOptions}} 

客戶端JS

Meteor.startup(function() { 
    GoogleMaps.load({ 
     v: '3', 
     key: 'YOUR_KEY' 
    }); 
}); 

Template.YOUR_TEMPLATE.helpers({ 
    mapOptions:() => { 
     if (GoogleMaps.loaded()) { 
      return { 
       center: new google.maps.LatLng(YOUR_MAP_LAT, YOUR_MAP_LNG), 
       zoom: 1 
      }; 
     } 
    } 
}); 

Template.YOUR_TEMPLATE.onRendered(function(){ 
    GoogleMaps.ready('map', function(map) { 
     let marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(YOUR_MARKER_LAT, YOUR_MARKER_LNG), 
      map: map.instance 
     }) 
     let infowindow = new google.maps.InfoWindow({ 
      content: 'SOME CONTENT' 
     }) 
     marker.addListener('click', function(event){ 
      infowindow.open(map.instance, marker); 
     }) 


    }); 
}); 
相關問題