Black and White Google Maps

black-and-white-google-maps.js

var styles = [
	{
		featureType: 'water',
		elementType: 'all',
		stylers: [
			{ hue: '#000000' },
			{ saturation: -100 },
			{ lightness: -100 },
			{ visibility: 'on' }
		]
	},{
		featureType: 'landscape.man_made',
		elementType: 'all',
		stylers: [
			{ hue: '#eeeeee' },
			{ saturation: -100 },
			{ lightness: 39 },
			{ visibility: 'on' }
		]
	},{
		featureType: 'landscape',
		elementType: 'all',
		stylers: [
			{ hue: '#ffffff' },
			{ saturation: -100 },
			{ lightness: 100 },
			{ visibility: 'on' }
		]
	},{
		featureType: 'administrative.province',
		elementType: 'labels',
		stylers: [
			{ hue: '#ffffff' },
			{ saturation: 0 },
			{ lightness: 100 },
			{ visibility: 'off' }
		]
	},{
		featureType: 'administrative.locality',
		elementType: 'labels',
		stylers: [
			{ hue: '#ffffff' },
			{ saturation: 0 },
			{ lightness: 100 },
			{ visibility: 'off' }
		]
	}
];
var options = {
	mapTypeControlOptions: {
		mapTypeIds: [ 'Styled']
	},
	center: new google.maps.LatLng(54.32, 10.100000000000023),
	zoom: 4,
	mapTypeId: 'Styled'
};
var div = document.getElementById('map');
var map = new google.maps.Map(div, options);
var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' });
map.mapTypes.set('Styled', styledMapType);