WordpressのGmapに吹き出しを付けたい
wordpressにACFを利用して埋め込んでいるGooglemapのピンにクリックで表示される吹き出しを付けたいのですが、うまくいきません。
しばらく前にwordpressのサポートでも質問したのですが回答を得られなかったのでかなり困っています。
状況としては、
「Advanced Custom Fieldsの全項目解説・公開側表示編集編」(http://blog.s-giken.net/253.html#googlemap)
を参考に下記のように書きました。
記述場所はphpファイル内です。
<?php
$name = get_field ( 'name' );
$map = get_field ( 'map' );
echo '<div id="map" style="width: 95%; height: 300px; margin:5px auto;"></div>';
echo '<span itemprop="hasMap"><script type="text/javascript">';
echo ' google.maps.event.addDomListener(window,"load",function(){';
echo ' var mapdiv=document.getElementById("map");';
echo ' var myOptions={zoom:15,center:new google.maps.LatLng(' . $map[lat] . ',' . $map[lng] . '),mapTypeId:google.maps.MapTypeId.ROADMAP,scaleControl:true};';
echo ' var map=new google.maps.Map(mapdiv,myOptions);';
echo ' var marker=[];';
echo ' var infowindow=[];';
echo ' marker[0]=new google.maps.Marker({icon:"http://maps.google.com/mapfiles/kml/paddle/red-stars.png",position:new google.maps.LatLng(' . $map[lat] . ',' . $map[lng] . '),map:map,title:"' . $name . '"});';
echo ' var markerCluster=new MarkerClusterer(map,marker);';
echo ' });';
echo '</script></span>';
?>
この状態でACF側で入力した住所をもとにマップ上に指定のマーカーを立てることはできているのですが、ここにクリックで表示される吹き出しを追加しようとしてもうまくいきません。
「マーカーがクリックされたら情報ウィンドウ(ふきだし)を表示する」(http://www.openspc2.org/reibun/Google/Maps/API/ver3/code/map/marker/0004/)
や
「配列を使用してGoogleMapに複数のマーカと情報ウィンドウを表示する」(https://ghweb.info/post-2709.html)
を参考にいろいろいじってみて、
google.maps.event.addListener(marker, "click", function() {
infowindow[0]=new google.maps.InfoWindow({
content: "このコンテンツを表示します"
});
infowindow.open(map, marker);
});
みたいな感じのをecho' 'で挟んで追記すれば動くかなと試したのですが、どうもうまくいきません。
解決方法をご教授いただければ幸いです。
お礼