각각의 팝업창에 마커 띄우기 질문입니다.
본문
현재 메인화면에 구글지도를 불러와 마커를 띄워놨습니다.
<script>
var map;
function initMap() {
var Y = "35.xxxx"; //Y좌표
var X = "126.xxxx"; //X좌표
var zoomLevel = 16; // 지도의 확대 레벨 : 숫자가 클수록 확대됨
var markerTitle = "본점"; // 현재 위치 마커에 마우스를 올렸을 때 나타나는 정보
var markerMaxWidth = 300; // 마커를 클릭했을때 나타나는 말풍선의 최대 크기
// 말풍선 내용
var contentString = '<div>' + '<b>본점</b>' + '</div>'; // 링크도 넣을 수 있음
var myLatlng = new google.maps.LatLng(Y, X);
var mapOptions = {
zoom: zoomLevel,
center: myLatlng,
maptypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: markerTitle
});
var infowindow = new google.maps.InfoWindow({
content: contentString,
maxWidth: markerMaxWidth
});
infowindow.open(map, marker);
}
</script>
<div id="map" style="height:500px;"></div>
현재 메인 마커이구요
지점은 버튼을 누르면 지도가 팝업으로 떠서 나타나 지고 있습니다.
저는 그 팝업으로 뜨는 지도부분에 마커가 뜨게 하고 싶은데
제가 찾았던 여러개 마커를 찍는거는 하나의 지도에 여러개 마커를 나타내는거라
저같이 따로 팝업창이 떠서 그 지점만 또 따로 표시가 되게 하는거하고는 차이가 있더군요
저 위의 스크립트를 각각의 div안에 지점이 3개면 3개 이런식으로 각각 다 넣어줘야하는 건가요?
아니면 하나의 스크립트에서 해결하는 방법이 있나요?
