구글 맵에 멀티플 마커

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

첨부파일

random-markers.htm (4.9 KB) 25회 2012-01-04 09:19
|

댓글 6개

링크가 샘플인데, 소스보기해서 그대로 커스트마이징 하시면 ㅜㅜ
좌표를 랜덤으로 만드는 부분이 있는데, 이부분을 어떻게 게시판과 연결하는지 샘플이라도..
2012-01-05 (목) 11:44:05
감사합니다
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내용을 넣고 싶은데, 어떤식으로 해야 되는지요?
전에 만들었던 것인데 좀 틀리긴해도 나름대로 게시판과 연동하였던겁니다.
많은 도움되시길..
http://linkma.kr/gpsmap.php
헌이님 감사합니다. 지금것은 Version 3입니다. Version 2에서는 게시판과 연동을 GDownloadUrl에서 xml 파일로 처리한 것 같습니다. 구글맵 API가 너무 어렵네요
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
12-08-29 조회 5,452
12-08-21 조회 3,444
12-08-21 조회 3,531
12-08-05 조회 3,349
12-08-04 조회 4,322
12-07-31 조회 9,203
12-07-26 조회 3,860
12-07-24 조회 3,490
12-07-20 조회 3,419
12-07-15 조회 3,296
12-07-09 조회 4,662
12-07-09 조회 3,373
12-07-09 조회 3,284
12-07-06 조회 4,102
12-07-05 조회 3,200
12-07-05 조회 3,276
12-06-30 조회 3,405
12-06-29 조회 3,201
12-06-26 조회 3,401
12-06-18 조회 3,276
12-06-18 조회 3,379
12-05-31 조회 3,594
12-05-29 조회 4,349
12-05-23 조회 3,385
12-05-22 조회 3,636
12-05-17 조회 4,446
12-05-10 조회 3,467
12-05-06 조회 3,342
12-05-04 조회 3,025
12-04-25 조회 3,475
12-04-21 조회 2,990
12-04-21 조회 4,395
12-04-20 조회 3,537
12-04-10 조회 2,954
12-04-06 조회 2,832
12-04-05 조회 3,174
12-04-05 조회 3,845
12-03-31 조회 2,963
12-03-30 조회 3,060
12-03-29 조회 2,977
12-03-28 조회 2,995
12-03-27 조회 3,311
12-03-26 조회 3,706
12-03-23 조회 2,894
12-03-20 조회 2,955
12-03-12 조회 2,882
12-03-12 조회 3,228
12-03-12 조회 3,140
12-03-12 조회 4,092
12-03-12 조회 5,605
12-03-12 조회 3,684
12-03-12 조회 5,492
12-03-12 조회 3,692
12-03-12 조회 6,049
12-03-06 조회 3,011
12-03-04 조회 4,144
12-03-02 조회 4,006
12-02-16 조회 5,129
12-02-15 조회 4,470
12-02-11 조회 2,973
12-02-08 조회 2,823
12-02-08 조회 3,842
12-02-07 조회 3,242
12-01-30 조회 2,936
12-01-29 조회 3,360
12-01-25 조회 3,351
12-01-19 조회 2,883
12-01-12 조회 3,033
11-12-30 조회 3,664
11-12-29 조회 3,021
11-12-26 조회 3,050
11-12-26 조회 2,939
11-12-17 조회 4,071
11-12-17 조회 3,267
11-12-01 조회 3,043
11-11-19 조회 4,221
11-11-14 조회 4,102
11-11-14 조회 2,726
11-11-10 조회 2,961
11-11-10 조회 3,625
11-10-27 조회 2,465
11-10-26 조회 2,583
11-10-25 조회 2,459
11-10-17 조회 3,618
11-10-10 조회 2,535
11-10-03 조회 2,588
11-09-28 조회 2,471
11-09-28 조회 3,968
11-09-26 조회 2,451
11-09-26 조회 2,568
11-09-25 조회 2,853
11-09-19 조회 6,015
11-09-09 조회 2,929
11-09-08 조회 3,300
11-08-31 조회 3,101
11-08-29 조회 5,088
11-08-25 조회 2,767
11-08-23 조회 2,447
11-08-21 조회 2,457
11-08-19 조회 2,381