몰라용님의 구글지도 첨부게시판을 사용하는데요...
본문
클릭해주셔서 감사합니다~!!!
오늘은 날씨가 많이 풀렸네요. 주말부터는 다시 추워진다고 합니다.
다름이 아니오라
몰라용님의 구글지도 첨부게시판 스킨을 사용하고 있는데요. 아래는 몰라용님의 스킨 링크입니다.
구글맵에서 말풍선이 나오지를 않아서 문의를 드립니다.
http://frontis.co.kr/?event=eagle-lsar-%EC%9A%B4%EC%9A%A9%EA%B5%90%EC%9C%A1-3
저 싸이트처럼 들어가자마자 말풍선이 나오게 하고 싶은데요.
아래는 몰라용님의 view.skin.php중에 구글이 있는 영역입니다.
<div id="googlmap">
<script src="https://maps.google.com/maps/api/js?sensor=true&key=AIzaSyBKN8UAci3v2GLnHkSWq1iXzsoEj_0PW8c"></script>
<script type="text/javascript">
var map;
var geocoder;
var marker;
var ymakerimg = '<?php echo $board_skin_url ?>/img/map.png';
function mgminfomap(){
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng('<?=$write[wr_8]?>','<?=$write[wr_9]?>'); //초기화면부분
var googlmapOption = {
zoom : 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('googlmap'), googlmapOption);
marker = new google.maps.Marker({
position:latlng,
icon : ymakerimg,
map:map
});
// 이동시 좌표와 주소 변경이벤트
google.maps.event.addListener(map, 'dragend', function(){
moveLatlng();
changeAddress();
});
};
// 이동시 좌표구하기
function moveLatlng(){
var mll=map.getCenter();
document.getElementById('wr_8').value = mll.lat();
document.getElementById('wr_9').value = mll.lng();
addMark(mll.lat(), mll.lng());
}
function changeAddress(){
geocoder.geocode( { 'location': map.getCenter()}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var str="";
for(var i=3; i>=0; i--){
str += " "+results[0].address_components[i].short_name;
}
document.getElementById('wr_10').value=str;
document.getElementById('wr_15').value=str;
} else {
alert("주소를 찾지 못했습니다 " + status);
}
});
}
function codeAddress(){
var address = document.getElementById('wr_10').value;
// 주소입력안했을때 경고창
if(address=='검색할 주소를 입력하십시오.' || address==''){
alert('검색할 주소를 입력하십시오.');
document.getElementById("wr_10").value='';
document.getElementById("wr_10").focus();
return;
}
geocoder.geocode({'address':address}, function(results, status){
if(status == google.maps.GeocoderStatus.OK){
map.setCenter(results[0].geometry.location);
addMark(results[0].geometry.location.lat(), results[0].geometry.location.lng());
document.getElementById('wr_15').value = results[0].formatted_address;
document.getElementById('wr_8').value = results[0].geometry.location.lat();
document.getElementById('wr_9').value = results[0].geometry.location.lng();
}else{
alert('주소를 찾지 못했습니다 :'+status);
}
});
}
function addMark(lat,lng){
if(typeof marker!='undefined'){
marker.setMap(null);
}
marker = new google.maps.Marker({
map: map,
icon : ymakerimg,
position: new google.maps.LatLng(lat,lng)
});
var infowindow = new google.maps.InfoWindow({
content: '위도: ' + lat + '<br>경도: ' + lng
});
infowindow.open(map,marker);
}
function moveMarker(lat, lng){
marker.setPosition(lat, lng);
}
function mypoint(){
// 나의위치 찾아보기
if (navigator.geolocation) {
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position){
var initialLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
// 좌표를 주소로변환
geocoder.geocode({'latLng' : initialLocation}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK) {
if (results[1]) {
document.getElementById('wr_15').value = results[3].formatted_address;
document.getElementById('wr_10').value = results[3].formatted_address;
}
} else {
alert("위치를 찾지 못했습니다: " + status);
}
});
document.getElementById('wr_8').value = position.coords.latitude;
document.getElementById('wr_9').value = position.coords.longitude;
map.setCenter(initialLocation);
marker.setPosition(initialLocation);
}, function(){
handleNoGeolocation(browserSupportFlag);
});
}
else if (google.gears) {
browserSupportFlag = true;
var geo = google.gears.factory.create('beta.geolocation');
geo.getCurrentPosition(function(position){
var initialLocation = new google.maps.LatLng(position.latitude, position.longitude);
// 좌표를 주소로변환
geocoder.geocode({'latLng' : initialLocation}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK) {
if (results[1]) {
document.getElementById('wr_15').value = results[3].formatted_address;
document.getElementById('wr_10').value = results[3].formatted_address;
}
} else {
alert("위치를 찾지 못했습니다: " + status);
}
});
document.getElementById('wr_8').value = position.coords.latitude;
document.getElementById('wr_9').value = position.coords.longitude;
map.setCenter(initialLocation);
marker.setPosition(initialLocation);
}, function(){
handleNoGeoLocation(browserSupportFlag);
});
// Browser doesn't support Geolocation
}
else {
browserSupportFlag = false;
handleNoGeolocation(browserSupportFlag);
}
}
google.maps.event.addDomListener(window, 'load', mgminfomap);
</script>
어느부분을 수정해야 하는지좀 알수 있을까요???
그누보드 회원님들 덕분에 많이 배워 갑니다.
항상 감기조심하시고 좋은하루 시작 하셔요~~!!!
답변 1
https://developers.google.com/maps/documentation/javascript/examples/infowindow-simple?hl=ko
위 링크 페이지에서 설명하고 있는것 같네요.
마커를 클릭하면 말풍선이 나오는데 해당 기능을 연구하시면 될것같네요.
아무리 해봐도 안되서 포기 했습니다 ㅠㅠ
답변 감사합니다.
좋은하루 보내시고 항상 건강하셔요~!!
답변을 작성하시기 전에 로그인 해주세요.
