Hello I can darken the water at the same time changing to a styled map so other values get reset. What I want is a map with green landscape like MapTypeId.TERRAIN has and darker water. I could manage make the water darker and now also want green landscape same way MapTypeId.TERRAIN has. Can you recommend a way? Thanks
+1
A:
At the moment, the Google Styled Maps cannot be applied to map types other than the default ROADMAP
type. This was confirmed by a Google Employee on the mailing list on May 31st 2010:
However, if you simply want a greener terrain with dark water, you can still style the default ROADMAP
to look something like this:
Example source code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps Dark Water Style Demo</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 550px; height: 300px;"></div>
<script type="text/javascript">
var darkStyle = [
{
featureType: "landscape",
elementType: "all",
stylers: [
{ visibility: "on" },
{ hue: "#1aff00" },
{ lightness: -17 }
]
},{
featureType: "water",
elementType: "all",
stylers: [
{ hue: "#1900ff" },
{ invert_lightness: true },
{ lightness: -56 },
{ saturation: 31 },
{ visibility: "simplified" }
]
},{
featureType: "administrative",
elementType: "all",
stylers: [
{ gamma: 0.82 },
{ visibility: "on" },
{ lightness: -18 },
{ hue: "#00ff4d" },
{ saturation: 27 }
]
}
];
var map = new google.maps.Map(document.getElementById('map'), {
mapTypeControlOptions: {
mapTypeIds: [
'darkwater',
google.maps.MapTypeId.ROADMAP,
google.maps.MapTypeId.TERRAIN
]
},
center: new google.maps.LatLng(30, 0),
zoom: 1,
mapTypeId: 'darkwater'
});
map.mapTypes.set(
'darkwater', new google.maps.StyledMapType(darkStyle, {
name: 'Dark'
})
);
</script>
</body>
</html>
Daniel Vassallo
2010-10-01 13:58:24
Thanks for the informative help. It looks good.
LarsOn
2010-10-02 05:06:16