웹사이트 찾아오는길에 구글지도 넣을 때, 동해, 독도 나오게 하는 방법

 

최근 공공기관 등의 홈페이지에서, '찾아오는 길' 안내 메뉴에 사용한 지도에 '일본해' 표기가 돼 있어서 난리가 났다.

 

한글 홈페이지는 네이버나 다음 지도를 이용해서 문제가 없었는데, 영어 홈페이지에 구글맵을 이용하면서 신경을 쓰지 않아서 이런 문제가 생긴 것이다.

 

잘 모르는 사람들은 "구글지도를 사용해서 이런 일이 생겼다"라고 말하지만, 그렇지는 않다. 구글 지도를 사용하더라도 설정을 한국으로만 해주면, 독도와 동해가 영어로 표기된다.

 

 

 

API key 없이 개발용으로 간단하게 만들어서 화면이 어둡게 나왔는데, 위 지도를 보면, 'East Sea'와 'Dokdo'가 영어로 표기돼 나오는 것을 볼 수 있다. 물론 GPS 좌표로 표시한 위치도 잘 나온다.

 

간단하게 구글맵으로 위치를 표시한다면 대략 아래 코드를 이용하면 된다.

 

<div id="map"></div>
<script>
  var map;
  function initMap() {

  var namsan = {lat: 37.542846, lng: 126.996411};
  
  var map = new google.maps.Map(
   document.getElementById('map'), {zoom: 15, center: namsan});
  
  var marker = new google.maps.Marker({position: namsan, map: map});
  }
</script>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap&language=en&region=KR"
    async defer></script>  

 

여기서 'maps.googleapis...' 이 부분만 신경쓰면 된다.

 

"language=en&region=KR"

지역(region)을 KR로 설정하는 것이 핵심이다. 언어는 영어(en), 한국어(ko) 등을 선택하면 된다.

 

이 코드에서 key만 붙여 넣으면 대충 간단하게 붙여넣어 사용할 수 있다. 아래에 코드를 첨부한다.

 

loc.zip

 

p.s.

사건이 터지니까 아예 찾아오는 길 메뉴를 없애는 곳도 있고, 지도를 없애고 주소만 써 놓은 곳도 있고 해서 안타까운 마음에 써본다. 코드 하나만 살짝 고치면 되는데. 누가 볼지는 모르겠지만.