구글 맵에 멀티플 마커 > 개발자팁

개발자팁

개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.

구글 맵에 멀티플 마커 정보

JavaScript 구글 맵에 멀티플 마커

첨부파일

random-markers.htm (4.9K) 29회 다운로드 2012-01-04 09:19:15

본문

자바스크립트를 전혀 모릅니다.
첨부 파일이나 링크와 같이 옆쪽은 제목이 나오고,  제목이나 마커를 클릭하면 풍선에 내용이 나오게 연결해 보고 싶은데, 기본적인 아이디어나 비슷한 사례를 만들어 주시면 대단히 감사하겠습니다.
추천
0

댓글 6개

for (var n = 1; n <= Gnu.numMarkers; n++) {
      var html = 'Opening marker #' + n;

      // Place markers on map randomly.
      var randX = Math.random();
      var randY = Math.random();
      randX *= (randX * 1000000) % 2 == 0 ? 1 : -1;
      randY *= (randY * 1000000) % 2 == 0 ? 1 : -1;
      var randLatLng = new google.maps.LatLng(
          center.lat() + (randX * 0.1),
          center.lng() + (randY * 0.1));
      var marker = new google.maps.Marker({
        map: Gnu.map,
        title: 'Marker #' + n,
        position: randLatLng,
        draggable: true
      });
      Gnu.markers.push(marker);

      // Create marker info window.
      var infoWindow = new google.maps.InfoWindow({
        content: [
          '<h3 style="">',
          'Marker #' + n,
          '</h3>',
          'Located at:',
          '<div style="font-size: 0.8em;">',
          randLatLng.lat() + ', ' + randLatLng.lng(),
          '</div>'
        ].join(''),
        size: new google.maps.Size(200, 80)
      });

      // Add marker click event listener.
      google.maps.event.addListener(
          marker, 'click', Gnu.openInfoWindow(infoWindow, marker));

      // Generate list elements for each marker.
      var li = document.createElement('li');
      var aSel = document.createElement('a');
      aSel.href = 'javascript:void(0);';
      aSel.innerHTML = 'Open Marker #' + n;
      aSel.onclick = Gnu.generateTriggerCallback(marker, 'click');
      li.appendChild(aSel);
      ul.appendChild(li);

      // Sum up all lat/lng to calculate center all points.
      avg.lat += randLatLng.lat();
      avg.lng += randLatLng.lng();
    }
자바스크립트의 이 부분에서 스킨의 게시판과 연동할려면
<?
    for ($i=0; $i<count($list); $i++) {
                .........
$lat=$list[$i][wr_2];
                $lng=$list[$i][wr_3];
                echo("var randLatLng = new google.maps.LatLng($lat, $lng);\n");
              .........
        }
        ?>
        이런식으로 처리하면 될것도 같은데, 중간에 Infowindows 의 content부분은 어떤식으로 처리를 해야 될지요?  여기세 wr_subject와 wr_4내용을  넣고 싶은데,  어떤식으로 해야 되는지요?
헌이님 감사합니다.  지금것은 Version 3입니다.  Version 2에서는 게시판과 연동을 GDownloadUrl에서 xml 파일로 처리한 것 같습니다.  구글맵 API가 너무 어렵네요
전체 4

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1402호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT