목적: 지도위에 다른 컨텐츠를 띄우기위하여 지도의 가독성을 높이되 방해하지 않게..
다시 바꺼봅시다
대한민국 전체가 나오도록 레벨을 조절
바로 옆나라 일본으로가서 같은레벨에서 조정해보자.
Study Area : Chiyoda, Tokyo
style 0
administrative.province 같은경우에는 label을 남긴채 Geometry (경계)를 없앤다.
style 1
administrative.locality 경우에 label만 지우고 POI Point는 남긴다.
음.. 갈끔하군
한단계 더 줌인해서 들어가본다
현재 locality (즉, 도시 POI)를 point만 남기고 label은 끈 상태이기떄문에 깔끔해보이나..
다시 label 켜보면
이러한 느낌이다.
이제 Small Scale 에서 전체적인 지도의 느낌을 보았으니
전체적인 윤곽에서 도로의 색상을 정해보자
style 2
road.highway를 정해봅시다.
본 지도는 네비게이션용도가 아니므로 highway를 강조해야할 이유가 없다고 생각된다.
도로의 weight 을 0.5로 하였다.
지도의 convention을 살려 도로의 색은 회색빛이나게끔 하였고
RGB
128,128,128
Transparent 의 효과를 넣고 싶었으나 옵션선택이 불가능하여 Lightness을 올렸다.
도로색상이 시들어?버려서 지도가 좀 간결해진 느낌이 있다.
한레벨만 더 zoom-in해도 철도노선과 각동 Label이 찍혀있다. (Arterial 과 Local 도로는 나중에 해결한다) 현재 레벨에선 보이지 않으므로
이것들의 효과를 최소화 하여 좀더 간결하게 지도를 만들어보려고한다.
Transit 속성이다.
Transit 은 public transit 을 포함한 몇개의 highway도 함께 컨트롤이 된다. 따라서 transit 을 없애거나 색을 바꾸기보다는 Weight을 줄여서 표현하기로하였다.
또한 Road Name을 없애 지도를 더럽히지 않게 해보았다.
transit.line 에서 labels.text 를끄고
Weight 을 0.3으로
여기서 다시 한단게 들어가보면
본격적으로 지도가 더럽다.
지정도 레벨에선 어떤것을 표현하기가 애매하므로 컨텐츠 정보는 클러스터 타입의 구름 등이 올라갈것으로 예상
가장 방해되는 요소는 역시나 지하철과 도로이다.
철도, 지하철의 Label의 visibility 를 simplify 시킨다
일단 Label 만 없앴는데도 괜찮다
또한 도로의 Label 도 없애보자
나쁘지 않은것 같다
한레벨 더 들어가보자.
JCT와 IC가 눈에 띈다.
없애자 없애자 .. 그런데 POI 컨트롤에서 바꾸게 되는데 일본의 경우 IC, JCT는 Business 에 들어가게된다..
중요한 POI 인 도쿄디즈니랜드같은경우 POI를 지켜야하나..
IC와 JCT를 지우기위해선.. 포기해야하는 경우가 생긴다
하지만!! labels 속성에 icons을 지우게되면 괜찮다! 된다!
여기서 간과하고 있던사실..
많은 젊은이들과 사람들은 지하철, 버스정류장등의 POI를 중심으로 위치를 탐색하는데..
Transit의 label을 꺼놓앗다.. 괜찮은가?
Airport의 POI 켜고 (많지 않으므로 괜찮다) Lightness를 높여서 (15) Transparent 효과가 나게 해본다
문제는 Rail 이다.
대도시의 경우 Subway, rail stations 들이 많기에 조정해야한다.
일본의 경우
이러하다.
Transparent를 적용하거나 글씨체의 weight을 조정하면 해결될듯하다.
하지만 HUE 와 Lightness 그리고 Gamma를 조정해서 문제를 해결해볼까 한다.
지명에대한 POI 이기 떄문에 어느정도 중요하다고 생각해서 Gamma 를 조정하여 글씨는 진하게
Lightness를 조정하여 옅으면서
Hue를 조정하여 글씨색상을 나쁘지 않게 해보았다
줌인해보니 좀더 수정해야할듯하여
다시 바꾸어봄..
줌인할수록 POI가 미친듯이 나타난다. 일단 모든 POI를 제거후 하나씩 켜보도록 해보려고한다.
그중에서 Text에 관련한것만 지워본다.
아이콘과 polygon은 남기고
이러한 상황에서
전체적으로한번 보자
여태까지 했던거 JSON으로 export
[
{
"featureType": "administrative.province",
"elementType": "geometry",
"stylers": [
{ "visibility": "off" }
]
},{
"featureType": "administrative.locality",
"stylers": [
{ "visibility": "simplified" }
]
},{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [
{ "visibility": "on" },
{ "color": "#808080" },
{ "weight": 0.5 },
{ "lightness": 60 }
]
},{
"featureType": "transit",
"elementType": "labels",
"stylers": [
{ "visibility": "simplified" }
]
},{
"featureType": "road",
"elementType": "labels.text",
"stylers": [
{ "visibility": "simplified" }
]
},{
"featureType": "poi.business",
"elementType": "labels.icon",
"stylers": [
{ "visibility": "off" }
]
},{
"featureType": "transit.line",
"elementType": "labels.text",
"stylers": [
{ "visibility": "off" }
]
},{
"featureType": "transit.station.airport",
"elementType": "labels",
"stylers": [
{ "visibility": "on" },
{ "lightness": 15 }
]
},{
"featureType": "transit.station.rail",
"stylers": [
{ "gamma": 0.39 },
{ "visibility": "on" },
{ "saturation": -58 },
{ "lightness": 42 }
]
},{
"featureType": "poi",
"elementType": "labels",
"stylers": [
{ "visibility": "off" }
]
}
]
Staticmap 의 주소
---------------------------------------------------------------------------
위에 이어서..
Attraction 정도는 있어도 좋다.
시부야-하라주쿠지역으로 옮긴다..
... 내가 도쿄에서 유일하게 가본 지역.
off
on
정부기관도 있으면 좋겠다.
병원 또한 중요한 POI 이겠다
공원도 물론 그러하다 하지만 Label 까지 붙여야하나는 고민된다.
교회와 절과 같은 신당,신사,성당 등등.. 중요한가? 대한민국에서는 아닌것 같다. 제외시킨다.
학교..중요하다.
여기서 이제 Label과 icon만 조금 약하게 만들어보자
이것저것 해보았는데
아이콘은 빼는것이 더 좋을듯하다.. 컨텐츠와 아이콘이 헷갈릴 수 있을듯하다
그리고 Lightness 를 조정하여 옅게 만들어보았다.
오늘의 교휸
Label 과 Label.text의 미묘한차이를 알면 좋다.
Google Maps API v3 Styled Maps JSON
[ { "featureType": "administrative.province", "elementType": "geometry", "stylers": [ { "visibility": "off" } ] },{ "featureType": "administrative.locality", "stylers": [ { "visibility": "simplified" } ] },{ "featureType": "road.highway", "elementType": "geometry", "stylers": [ { "visibility": "on" }, { "color": "#808080" }, { "weight": 0.5 }, { "lightness": 60 } ] },{ "featureType": "transit", "elementType": "labels", "stylers": [ { "visibility": "simplified" } ] },{ "featureType": "road", "elementType": "labels.text", "stylers": [ { "visibility": "simplified" } ] },{ "featureType": "poi.business", "elementType": "labels.icon", "stylers": [ { "visibility": "off" } ] },{ "featureType": "transit.line", "elementType": "labels.text", "stylers": [ { "visibility": "off" } ] },{ "featureType": "transit.station.airport", "elementType": "labels", "stylers": [ { "visibility": "on" }, { "lightness": 15 } ] },{ "featureType": "transit.station.rail", "stylers": [ { "gamma": 0.39 }, { "visibility": "on" }, { "saturation": -58 }, { "lightness": 42 } ] },{ "featureType": "poi", "elementType": "labels", "stylers": [ { "visibility": "off" } ] },{ "featureType": "poi.attraction", "elementType": "labels.text", "stylers": [ { "visibility": "on" }, { "lightness": 36 } ] },{ "featureType": "poi.government", "elementType": "labels.text", "stylers": [ { "visibility": "on" }, { "lightness": 36 } ] },{ "featureType": "poi.medical", "elementType": "labels.text", "stylers": [ { "visibility": "on" }, { "lightness": 36 } ] },{ "featureType": "poi.park", "elementType": "labels.text", "stylers": [ { "visibility": "on" }, { "lightness": 36 } ] },{ "featureType": "poi.school", "elementType": "labels.text", "stylers": [ { "visibility": "on" }, { "lightness": 36 } ] } ]
오늘한걸 동영상으로 정리해보면
'GIS > Styled Map' 카테고리의 다른 글
| 다음지도 따라하기... (0) | 2014.01.02 |
|---|---|
| 구글 스타일맵 이어서 - 바디 1 (0) | 2013.12.05 |
| 감성이 들어간 구글지도를 만들어 보자 - 프롤로그 (0) | 2013.10.18 |
| Google Styled Map 에 대해서 알아보자 (2) (0) | 2013.10.18 |
| Google Styled Map 대해서 알아보자 (1) (0) | 2013.10.16 |
