2013-10-09 4 views
0

Недавно я узнал a way изменить внешний вид Google Maps, как следующее изображение показывает,Как изменить значение по умолчанию Google Maps

enter image description here

В меню справки, то, что JSON посоветовал можно использовать для изменить карту по умолчанию или создать новый стиль. Хотя я могу получить код и понять его смысл, я не знаю, как и где его использовать для создания черно-белой карты. Как я могу это сделать?

Код

[ 
    { 
    "featureType": "landscape", 
    "stylers": [ 
     { "color": "#ffffff" } 
    ] 
    },{ 
    "featureType": "road", 
    "stylers": [ 
     { "color": "#000000" } 
    ] 
    },{ 
    "featureType": "water", 
    "elementType": "geometry", 
    "stylers": [ 
     { "color": "#ffffff" } 
    ] 
    },{ 
    "featureType": "poi", 
    "stylers": [ 
     { "color": "#ffffff" } 
    ] 
    } 
] 

Google предлагает a way, но я не знаю, как применить его. Где, например, MapOptions?

Любые идеи более чем приветствуются!

ответ

1

Полный список примеров:
Я добавил его здесь.

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Google Maps</title> 

     <style> #map-canvas { margin: 0; padding: 0; height: 400px; width: 100%; } 
     </style> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
     <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script> 
    function initialize() { 

    var styles = [ 
    { 
     "featureType": "landscape", 
     "stylers": [ 
     { "color": "#ffffff" } 
     ] 
    },{ 
     "featureType": "road", 
     "stylers": [ 
     { "color": "#000000" } 
     ] 
    },{ 
     "featureType": "water", 
     "elementType": "geometry", 
     "stylers": [ 
     { "color": "#ffffff" } 
     ] 
    },{ 
     "featureType": "poi", 
     "stylers": [ 
     { "color": "#ffffff" } 
     ] 
    } 
    ]; 

    google.maps.visualRefresh = true; 
    var styledMap = new google.maps.StyledMapType(styles,{name: "Styled Map"}); 
    var mapDiv = document.getElementById('map-canvas'); 

    var myOptions = { 
    zoom: 4, 
    center: new google.maps.LatLng(-25.363882, 131.044922), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(mapDiv, myOptions); 
    map.mapTypes.set('map_style', styledMap); 
    map.setMapTypeId('map_style'); 

} 

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

    </script> 

    </head> 
    <body> 
    <div id="map-canvas"> 
    </body> 
</html> 
+0

Большое спасибо за ваш ответ! Проблема не в коде, но где я должен добавить этот код? – Thanos

+0

, который находится внутри тегов вашего html-кода. Не забудьте также добавить это: jonco91

+0

Я вижу. Дело в том, что этот код http://pastebin.com/TmhCehKC не просует какую-либо карту вообще ... – Thanos

Смежные вопросы