GoogleMap 배경 지도를 클라우드에서 스타일링하기
  • SPH Facebook
  • SPH Blog

GoogleMap 배경 지도를 클라우드에서 스타일링하기

2020-07-01

SPH-HJ

기존에는 구글 지도를 커스터마이징 하기 위해서는 직접 코드로 옵션을 설정해야 했습니다.

하지만 이제는 새로운 베타 버전 기능으로 클라우드 상에서 구글 지도를 손쉽게 스타일링하고, Maps JavaScript API에서 스타일링한 지도를 배경 지도로 호출할 수 있습니다.


 

구글 지도를 커스터마이징하는 기능은 구글 클라우드 플랫폼에서 좌측 메뉴 중 ‘Google 지도’ 메뉴에서 이용할 수 있습니다.


 

지도 스타일 만들기

우선 ‘지도 스타일’ 메뉴에서 ‘CREATE NEW MAP STYLE’을 클릭해서 커스텀할 지도 스타일을 생성합니다.

지도 스타일은 여러 개를 생성할 수 있습니다.


 

기본 지도 스타일은 구글에서 제공하는 색상 테마에서 선택하거나, 이미 정의해놓은 JSON을 가져와서 생성할 수도 있습니다.


 

기본 지도 스타일을 설정했다면 자세한 지도 스타일을 설정합니다.

지도에 나타낼 장소 유형부터 해당 장소 유형의 글자 색은 무엇으로 나타낼 것인지, 무슨 색으로 채울 것인지 등을 마음대로 선택할 수 있습니다.

예를 들어 공원을 나타내는 글자를 빨간색으로 설정한다거나, 강과 바다 같이 물이 있는 곳을 파란색으로 설정할 수 있습니다.

지도에 장소를 얼마나 빼곡하게 나타낼 것인지 POI 밀집도 또한 마음대로 조정할 수 있습니다.


 

커스텀한 지도 사용하기

이렇게 커스터마이징한 지도 스타일은 ‘지도 관리’메뉴에서 지도를 생성해 사용할 수 있습니다.


 

생성한 지도 정보 화면에서 위에서 커스텀 한 지도 스타일을 선택해 적용합니다.


 

스타일을 설정한 지도는 지도의 ID 값을 활용해서 Maps JavaScript API를 호출하는 부분에서 아래와 같이 사용할 수 있습니다.

 

<script async defer

      src=”https://maps.googleapis.com/maps/api/js?key=${YOUR_API_KEY}&callback=initMap&map_ids=${YOUT_MAP_ID}“>

</script>

 

클라우드 기반 지도 커스텀 기능을 이용하면 지도 ID 값을 바꿔 다른 모양의 지도로 쉽게 변경이 가능해 좀 더 유연하게 구글 지도를 사용, 관리할 수 있습니다.

 

참고

Maps Customization Features Overview (Beta)

 

 

 

SPH는 Google Maps, SuperMap, Maxar Technologies 등 다양한 케이스에 존재하는 다양한 제품군을 보유하고 있는 고객의 사례에 꼭 맞는  무료 세미나 및 인적 컨설팅을 제공하고 있습니다. 각 케이스에 더욱 자세한 이야기를 나누고 싶으시다면, 여기에서 문의 주시길 바라며,  SPH에서 발행하는 GIS / 로케이션인텔리전스 관련 최신 소식을 받아보고 싶으신 분들은 페이스북 페이지 또는 뉴스레터를 구독해주시길 바랍니다. 감사합니다.


Powered by Froala Editor


SPH는 Google Maps, SuperMap, Maxar Technologies 등 다양한 제품군을 가지고 있으며, 고객의 사례에 꼭 맞는 무료 세미나 및 인적 컨설팅을 제공하고 있습니다. 더욱 자세한 이야기를 나누고 싶으시다면, 여기에서 문의 주시길 바라며, SPH에서 발행하는 GIS / 로케이션인텔리전스 관련 최신 소식을 받아보고 싶으신 분들은 페이스북 페이지 또는 뉴스레터를 구독해주시길 바랍니다

Newsletter구독 신청
문의하기
sph-symbol