var map; var marker = []; var infoWindow = []; var markerData = [{ name: 'ファシレ湯布院 6階部分', lat: 33.24959866921125, lng: 131.34732484817505, img: '/img_file/data/170331126822222-1.jpg', url: '/search/mansion/detail.php?170331126822222' } ,{ name: 'ファシレ 弐番館 ', lat: 33.25005241603683, lng: 131.3483663522043, img: '/img_file/data/170184367330318-1.jpg', url: '/search/mansion/detail.php?170184367330318' } ,{ name: 'ロマネスクリゾート湯布院', lat: 33.260197479592414, lng: 131.36190942526932, img: '/img_file/data/165338374914031-1.jpg', url: '/search/mansion/detail.php?165338374914031' } ,{ name: 'コスモ湯布院別邸 1階部分', lat: 33.26375077458497, lng: 131.36006174557303, img: '/img_file/data/16261386198976-1.jpg', url: '/search/mansion/detail.php?16261386198976' } ]; function initMap() { // 地図の作成 var mapLatLng = new google.maps.LatLng({ lat: 33.2626697, lng: 131.355101, // lat: markerData[0]['lat'], // lng: markerData[0]['lng'] }); // 緯度経度のデータ作成 map = new google.maps.Map(document.getElementById('map'), { // #sampleに地図を埋め込む center: mapLatLng, // 地図の中心を指定 zoom: 15 // 地図のズームを指定 }); // マーカー毎の処理 for (var i = 0; i < markerData.length; i++) { markerLatLng = new google.maps.LatLng({ lat: markerData[i]['lat'], lng: markerData[i]['lng'] }); // 緯度経度のデータ作成 marker[i] = new google.maps.Marker({ // マーカーの追加 position: markerLatLng, // マーカーを立てる位置を指定 map: map // マーカーを立てる地図を指定 }); infoWindow[i] = new google.maps.InfoWindow({ // 吹き出しの追加 content: '
' + '

' + markerData[i]['name'] + '

' + '
' + '詳細はこちら' + '
' // 吹き出しに表示する内容 }); markerEvent(i); // マーカーにクリックイベントを追加 } } // マーカーにクリックイベントを追加 function markerEvent(i) { marker[i].addListener('click', function () { // マーカーをクリックしたとき infoWindow[i].open(map, marker[i]); // 吹き出しの表示 }); }