※ ChatGPTを利用し、要約された質問です(原文:GoogleMapを複数表示させたい)
GoogleMapを複数表示させたい
このQ&Aのポイント
GoogleMapをAPIで2つ表示させて、地図にマーカーをつけたいです。
マップをもう1つ増やすにはどのように記述すればよいでしょうか?
現在のソースコードでは、1つの地図にマーカーを配置しています。
GoogleMap を API で2つ表示させて、それぞれの地図にマーカーをひとつずつつけたいです。
マーカーをつけて吹き出すをだすまではできたのですが、
マップをもうひとつ増やすにはどのように記述すればよいでしょうか?
現在のソースは以下です
--------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
#Gmap{
width:500px;
height:500px;
}
</style>
<script src="http://maps.google.com/maps?file=api&v=2&key=http://maps.google.com/maps?file=api&v=2&key=" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
//地図を作成
var map = new GMap2(document.getElementById("Gmap"));
map.setCenter(new GLatLng(35.675845,139.744763), 15);
//マーカーを作成
var marker = new GMarker(new GLatLng(35.675845,139.744763));
//マーカーをクリックしたら、吹き出しの中に写真を表示する
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml("テキストが入ります");
});
//マーカーを地図上に配置
map.addOverlay(marker);
//縮尺移動のコントロールを設置
map.addControl(new GLargeMapControl());
//地図衛星写真 切り替えボタンを表示
map.addControl(new GMapTypeControl());
//縮尺表示
map.addControl(new GScaleControl());
}
}
//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="Gmap"></div>
</body>
</html>
--------------------------------------------------------
よろしくお願いいたします
お礼
ご返答ありがとうございます 教えていただいたプログラムを元に、なんとかできました! 助かりました ありがとうございました また、よろしくお願いいたします