지도에 사용자 정의 스타일 적용

-3

먼저, 저는 프로그래머가 아닙니다.
무엇이 문제인지, 나는 웹을 둘러보고 Google지도를 사용자 정의하는 방법을 찾아 보았습니다.
그래서 API v3을 사용하여이 작업을 수행 할 수 있습니다. 올바른 코드를 찾으려면 Google의 스타일지도를 사용하여 코드를 가져 왔습니다.지도에 사용자 정의 스타일 적용

[ 
    { 
    featureType: "all", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    } 
]

그러나 사용 방법은 잘 모릅니다. 그래서 나는 내가 원하는 스타일로지도를 얻을

<iframe width="640" height="640" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.de/maps?hl=de&amp;ie=UTF8&amp;t=m&amp;ll=53.070843,8.800274&amp;spn=0.002256,0.00456&amp;z=17&amp;output=embed"></iframe><br /><small><a href="https://maps.google.de/maps?hl=de&amp;ie=UTF8&amp;t=m&amp;ll=53.070843,8.800274&amp;spn=0.002256,0.00456&amp;z=17&amp;source=embed" style="color:#0000FF;text-align:left">Größere Kartenansicht</a></small>

가 어떻게 코드를 결합 않습니다이 코드 (NO HEAD, BODY, 아니 아무것도)과 .html 파일이?
맵 스타일이 적용되도록 메모장에 무엇을 추가로 작성해야합니까?

출처

2013-01-02 Helga

먼저 Google Maps API 문서에 대한 링크를 제공해 드리겠습니다. Google은 프로그래머가 아닌 사람들을 위해서조차도 문서를 이해하기 쉽게 만들어줍니다.

https://developers.google.com/maps/documentation/javascript/tutorial

스타일링 사용에 대한이 이전 응답에서 살펴 : 여기

https://stackoverflow.com/a/11686763/1911676

그리고

는 게시 된 스타일로 구글의 자바 스크립트 API를 사용하는 예제 웹 페이지입니다. 그것은 당신을 위해 약간의 변화 여기

http://code.google.com/p/gmaps-samples-v3/source/browse/trunk/devfest-2010/manila/talk/maps/template.html?r=193&spec=svn197

있는 구글지도 샘플 템플릿에서 직접 복사됩니다.

<!DOCTYPE html> 
<html> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> 
    <style type="text/css"> 

/*you can change the map size here*/ 
    #map { 
    height: 640px; 
    width: 640px; 
    } 

</style> 

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 

<script type="text/javascript"> 
    function init() { 
    var map = new google.maps.Map(document.getElementById('map'), { 



//change map settings (origin, zoom amount, type...) 
     zoom: 17, 
     center: new google.maps.LatLng(53.070843, 8.800274), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 



    }); 
    } 
    google.maps.event.addDomListener(window, 'load', init); 



//Here is where you put your styles 
var styles = [ 
    { 
    featureType: "all", 
    elementType: "labels", 
    stylers: [ 
    { visibility: "off" } 
    ] 
    } 
]; 

/*this sets the style*/ 
map.setOptions({styles: styles}); 

</script> 


</head> 

<body> 
Other content 
<!--this is where your map is. This replaces the iframe--> 
<div id="map"></div> 
Other content 
</body> 
</html>

현재 작업을 볼 수 있습니다

http://jsfiddle.net/sP7m5/1/

도움이 되었기를 바랍니다.

출처

2013-01-02 06:14:43 Enigmadan

지도에 사용자 정의 스타일 적용

답변

관련 문제