고요빛물결

구글 맵에 멀티플 마커

· 2012-01-04 (수) 09:19:15 · 3860 · 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-04-26 조회 3,770
12-04-24 조회 3,172
12-04-23 조회 4,519
12-04-22 조회 3,215
12-04-19 조회 3,288
12-04-18 조회 4,354
12-04-18 조회 3,065
12-04-17 조회 3,333
12-04-17 조회 5,095
12-04-16 조회 3,499
12-04-13 조회 3,038
12-04-09 조회 3,105
12-04-04 조회 3,885
12-04-01 조회 3,172
12-03-31 조회 3,549
12-03-30 조회 3,168
12-03-30 조회 3,828
12-03-26 조회 3,446
12-03-26 조회 3,007
12-03-22 조회 3,174
12-03-21 조회 3,024
12-03-19 조회 3,445
12-03-17 조회 3,473
12-03-14 조회 3,198
12-03-10 조회 3,876
12-03-09 조회 3,460
12-03-09 조회 3,285
12-03-08 조회 3,760
12-03-08 조회 3,919
12-03-08 조회 4,024
12-03-03 조회 3,246
12-03-02 조회 4,602
12-02-28 조회 3,116
12-02-27 조회 2,921
12-02-25 조회 3,102
12-02-24 조회 3,802
12-02-23 조회 3,075
12-02-22 조회 3,602
12-02-22 조회 5,372
12-02-22 조회 3,941
12-02-22 조회 4,259
12-02-18 조회 3,742
12-02-17 조회 2,953
12-02-17 조회 3,367
12-02-14 조회 3,445
12-02-13 조회 3,323
12-02-10 조회 1만
12-02-08 조회 2,987
12-02-07 조회 3,329
12-02-06 조회 3,042
12-02-05 조회 3,521
12-01-31 조회 3,439
12-01-30 조회 9,628
12-01-29 조회 3,752
12-01-26 조회 3,391
12-01-25 조회 3,982
12-01-24 조회 3,380
12-01-10 조회 3,708
12-01-10 조회 4,449
12-01-09 조회 3,247
12-01-08 조회 7,103
12-01-08 조회 3,625
12-01-07 조회 5,142
12-01-04 조회 3,861
12-01-02 조회 3,079
12-01-02 조회 3,138
12-01-02 조회 3,449
12-01-01 조회 3,075
11-12-31 조회 3,376
11-12-31 조회 3,052
11-12-30 조회 3,228
11-12-30 조회 3,369
11-12-29 조회 3,569
11-12-28 조회 3,681
11-12-26 조회 3,244
11-12-23 조회 3,473
11-12-22 조회 3,003
11-12-15 조회 4,097
11-12-08 조회 3,929
11-12-05 조회 3,260
11-12-04 조회 5,681
11-12-03 조회 3,533
11-12-02 조회 3,315
11-12-01 조회 5,379
11-11-30 조회 2,869
11-11-30 조회 2,776
11-11-28 조회 3,118
11-11-26 조회 3,286
11-11-25 조회 3,309
11-11-24 조회 2,928
11-11-22 조회 3,003
11-11-22 조회 2,856
11-11-17 조회 2,784
11-11-11 조회 2,800
11-11-09 조회 2,855
11-11-08 조회 3,224
11-11-08 조회 2,516
11-11-04 조회 3,594
11-11-01 조회 2,906
11-10-26 조회 2,485