Googleマップの情報ウィンドウにjQueryのajaxリクエストのテキストを入力するにはどうすればよいですか？ [例を含む]

Question

ここでは、ajaxリクエストを作成し、テキストの段落を返すために処理します。私は、このテキストを「クリック」イベントで情報ウィンドウに入力したいと思います。

私のコードは、ajax呼び出しが成功し、地図とマーカーがビューにレンダリングされる限り機能します。しかし、私が望むように、情報ウィンドウには「クリック」イベントのテキストが表示されません。

代わりに、私は型エラーを取得：

TypeError: Cannot read property 'function(){ 
       wikiExtract(marker.title).then(function (data){ 
       infowindow...<omitted>... }' of undefined 

私は私には直感的に正しいと思われる別のパターンを試してみた場合、マップはすべてではロードされません。

google.maps.event.addListener('click', 
    wikiExtract(marker.title).then(function (data){ 
     infowindow.setContent(data); 
     infowindow.open(bayarea, marker) 
    }); 
); 

これは私です地図とアヤックスコール：

'use strict'; 

var bayarea; 
var markers = []; 

var initMap = function() { 
    const map = document.querySelector('#map'); 
    const center = { 
     lat: 37.656, 
     lng: -122.288 
    }; 

    bayarea = new google.maps.Map(map, { 
     center, 
     zoom: 9, 
     scrollwheel: false, 
    }); 

    var getMarkers = function getMarkers(siteDatabase) { 
     var i = 1; 
     for (var site in siteDatabase) { 
      site = siteDatabase[site]; 
      addMarker(site, i * 200); 
      i++; 
     }; 

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

     function addMarker(site, timeout) { 
      window.setTimeout(function() { 
       var marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(site.lat, site.lng), 
        map: bayarea, 
        title: site.position, 
        animation: google.maps.Animation.DROP 
       }); 
       google.maps.event.addListener('click',function(){ 
        wikiExtract(marker.title).then(function (data){ 
        infowindow.setContent(data); 
        infowindow.open(bayarea, marker); 
        }); 

       }); 
       markers.push(marker); 
      }, timeout); 
     }  
    }; 
    getMarkers(siteDatabase); 
}; 

function wikiExtract(site) { 
    return $.when(ventanaWik(site)).then((wiki) => { 
     return dig(wiki.query.pages).extract; 
    }); 
    function dig(object) { 
     return object[Object.keys(object)[0]]; 
    } 
    function ventanaWik(site) { 
     return $.ajax({ 
      type: 'json', 
      url: 'https://en.wikipedia.org/w/api.php' + '?origin=*' 
      + '&format=json' + '&action=query' + '&prop=extracts' 
      + '&exintro=' + '&explaintext=' + '&titles=' + site, 
      method: 'GET' 
     }).promise(); 
    } 
}; 

編集：このPAを使用している作品インスタンス：オブジェクト、eventNameの：文字列、ハンドラ：機能文書google.maps.event.addListener（）によると

var initMap = function() { 
    const map = document.querySelector('#map'); 
    const center = { 
     lat: 37.656, 
     lng: -122.288 
    }; 

    bayarea = new google.maps.Map(map, { 
     center, 
     zoom: 9, 
     scrollwheel: false, 
    }); 

    var getMarkers = function getMarkers(siteDatabase) { 
     var i = 1; 
     for (var site in siteDatabase) { 
      site = siteDatabase[site]; 
      addMarker(site, i * 200); 
      i++; 
     } 

     var infowindow = new google.maps.InfoWindow({ 
      content: "<i class='fa fa-spinner fa-spin fa-lg' style='color: #FFA46B;' title='Loading...'></i> Loading..." 
     }); 

     function addMarker(site, timeout) { 
      window.setTimeout(function() { 
       var marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(site.lat, site.lng), 
        map: bayarea, 
        title: site.position, 
        county: site.county, 
        animation: google.maps.Animation.DROP 
       }); 
      google.maps.event.addListener(marker, 'click', (function(marker, infowindow) { 
       return function() { 
        if (infowindow) { 
         infowindow.close(); 
        } 
        marker.setAnimation(google.maps.Animation.BOUNCE); 
        setTimeout(function(){ marker.setAnimation(null); }, 1500); 
        infowindow.open(bayarea, marker); 
        wikiExtract(marker.title).then(function(data) { 
         infowindow.setContent(data); 
        }); 
       }; 
      })(marker, infowindow)); 
      markers.push(marker); 
      }, timeout); 
     }  
    }; 
    getMarkers(siteDatabase); 
}; 

function wikiExtract(site) { 
    return $.when(ventanaWik(site)).then((wiki) => { 
     return dig(wiki.query.pages).extract; 
    }); 
    function dig(object) { 
     return object[Object.keys(object)[0]]; 
    } 
    function ventanaWik(site) { 
     return $.ajax({ 
      type: 'json', 
      url: 'https://en.wikipedia.org/w/api.php' + '?origin=*' 
      + '&format=json' + '&action=query' + '&prop=extracts' 
      + '&exintro=' + '&explaintext=' + '&titles=' + site, 
      method: 'GET' 
     }).promise(); 
    } 
} 

Answer 1

tternは、3つのパラメータがあります。動作しません、残念ながら

google.maps.event.addListener(marker, 'click', function(){ 
    wikiExtract(marker.title).then(function (data){ 
     infowindow.setContent(data); 
     infowindow.open(bayarea, marker); 
    }); 
});