Google Map （外部から情報ウィンドウ開く
Google Maps API v3 において「地図外のHTMLから地図内の情報ウィンドウを開く」ということをやろうとしているのですが、どうにもうまくいきません。
下記コードにおいて、地図外にある「あいうえお商店」や「かきくけこ不動産」をクリックした際、地図内に情報ウィンドウが開くようにするためにはどのようにすればよいでしょうか。
すでに丸3日間悩んでおり、私の力ではどうにもならないと判断したため、皆さまのお力をお借りすることにしました。大変恐れ入りますが、貧弱な知識の私にどうか知恵を与えてやって下さい。どうぞよろしくお願い致します。
深みにはまって抜け出せないコードは以下の通りです。
----------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>test</title>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var currentInfoWindow = null; //最後に開いた情報ウィンドウを記憶
function initialize() {
var latlng = new google.maps.LatLng(35.67105, 139.743624);
var opts = {
zoom: 13,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), opts);
// ***************１件目のデータ***************
var m_latlng1 = new google.maps.LatLng(35.675224, 139.737914);
var marker1 = new google.maps.Marker({position: m_latlng1,map: map,icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=1|3CFFF8|000000',title: '港区赤坂3-3-3'
});
var contentString1= '</p>あいうえお商店</p></div>';
var infowindow1 = new google.maps.InfoWindow({content: contentString1 });
// ***************１件目のデータ***************
// ***************２件目のデータ***************
var m_latlng2 = new google.maps.LatLng(35.670772, 139.733875);
var marker2 = new google.maps.Marker({position: m_latlng2,map: map,icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=2|3CFFF8|000000',title: '港区赤坂5-5-5'
});
var contentString2= '</p>かきくけこ不動産</p></div>';
var infowindow2 = new google.maps.InfoWindow({content: contentString2 });
// ***************２件目のデータ***************
google.maps.event.addListener(marker1 , 'click', function()
{ if (currentInfoWindow) {
currentInfoWindow.close();
}
infowindow1.open(map,marker1);
currentInfoWindow = infowindow1;
});
google.maps.event.addListener(marker2 , 'click', function()
{ if (currentInfoWindow) {
currentInfoWindow.close();
}
infowindow2.open(map,marker2);
currentInfoWindow = infowindow2;
});
}
function myclick(idx)
{
google.maps.event.trigger(marker[idx],'click');
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 700px; height: 500px"></div>
1 <a href="javascript:myclick(0)">あいうえお商店</a></p>
2 <a href="javascript:myclick(1)">かきくけこ不動産</a></p>
</body>
</html>
----------------------------------------------------------------
大変恐れ入りますが、どうぞよろしくお願い致します。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_3_thumbnail_img_sm.png)
お礼
どうもありがとうございます。 まずはアカウントを作成してみたいと思います。 教えていただいたURLもよく読んでみたいと思います。 ご回答、ありがとうございました。