Google Map을 블로그에서 보자.

이 내용은 어제발 기사인것 같습니다. 어제 조금 바빴다는 이유로 하루 늦은 포스팅을 하게 되네요.

Google이 Google Map을 웹 페이지에 넣을수(Embed) 있도록 했습니다.

관련기사는 ...
Google to Offer Embeddable Maps (via Read/WriteWeb)
YouTube-style Embeddable Maps (via Google Lat Long Blog)

새로 적용된 이 기능을 이용하면 바로 자신의 블로그에 구글 맵을 넣을 수 있습니다. 일전에 Channy님이 Google map과 Naver Map의 api를 활용해서 나만의 지도 만들기 라는 것을 오픈 했었는데요. 그 기능과 비슷한 기능이라고 보면 될 것 같습니다.

국내 포털의 지도 서비스 중에서 네이버맵은 아직 퍼가기 기능을 지원하지 않고 있고, 다음맵은 그 기능을 지원하고 있습니다. 야후 코리아의 맵은 콩나물의 맵을 써서 다음 맵과 동일한 기능이 구현 가능할 것으로 보이나 FireFox에서 보이지 않아서 테스트 하지 않았습니다.


구글 맵을 블로그에 넣기 위해서는 지도 우측 상단에 있는 "Link to this page"를 선택하면 됩니다. 선택해서 나오는 아래와 같은 상자에서 아랫쪽에 있는 코드를 블로그에 붙여 넣으면 되는 것이지요.
만약 지도가 원하는 위치를 표시해 주지 않으면, 그림의 아래에 있는 "Customize and preview embedded map"을 눌러서 좀더 세밀한 조정 후 올리는 것도 가능합니다.

아래는 서울시청 부근의 지도를 Google Map의 새로운 기능을 이용해서 제 블로그에 넣은 예제 입니다.


View Larger Map

아래는 기존에 Channy님이 만들어 놓은 메뉴를 이용해서 만든 예제 이구요.




마지막으로 아래는 다음 맵의 기능을 이용해서 만들어 봤습니다.

지도를 클릭하시면 서울시청 위치정보를 확인하실 수 있습니다.

각 지도를 테스트 해 보고나니, 구글 맵과 나만의 지도만들기의 경우 페이지 내에서 Drag 등이 가능하나 다음 맵에서는 이미지로 표현을 하다 보니 Drag는 불가능하고 맵을 클릭하면 새창에 다음 맵사이트의 해당 위치를 표시해 주네요. 즉, 구글 맵과 Channy님의 나만의 지도만들기는 맵을 붙여 넣을때 iframe을 사용해서 이글루스와 같은 블로그에서는 사용 불가능하지만, 다음 맵의 경우는 div를 사용해서 지도 정보를 올리는 것은 가능하나, 테스트해보니 이미지는 올라가는데 페이지 구조가 깨지는 현상이 나타나네요.