Untitled

<!DOCTYPE html>
<html>
<head>
    <title>Simple styled maps</title>
    <style>
        html, body, #map-canvas {
            height: 100%;
            margin: 0px;
            padding: 0px
        }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
    <script>
        var map;
        var brooklyn = new google.maps.LatLng(40.6743890, -73.9455);

        var MY_MAPTYPE_ID = 'custom_style';

        function initialize() {

            var featureOpts = [
                {
                    stylers: [
                        { hue: '#f2842b' },
                        { visibility: 'simplified' },
                        { gamma: 0.8 },
                        { weight: 0.8 }
                    ]
                },

                {
                    elementType: 'labels',
                    stylers: [
                        {
                            visibility: 'on'
                        }
                    ]
                },

                {
                    elementType: 'labels.text',
                    stylers: [
                        {
                            visibility: 'on',
                            color: "#000000"
                        }
                    ]
                },

                {
                    featureType: 'water',
                    stylers: [
                        {
                            color: '#5eb9ff',
                            gamma: 0.3, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 65, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 10
                        }
                    ]
                },

                {
                    featureType: 'road', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#ffffff', // kolor
                            gamma: 0.8, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 10 //pixels
                        }
                    ],
                    elementType: 'labels.text',         //tutaj zaczyna się konfiguracji nazwy ulic
                    stylers: [
                        {
                            visibility: 'on',
                            color: "#000000"
                        }
                    ]
                },

                {
                    featureType: 'administrative.land_parcel', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#4a4a4a', // kolor
                            gamma: 0.8, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 10 //pixels
                        }
                    ]
                },

                {
                    featureType: 'administrative.locality', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#1484d8', // kolor
                            gamma: 0.8, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                },

                {
                    featureType: 'landscape', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#f0ede5', // kolor
                            gamma: 0.8, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                },

                {
                    featureType: 'landscape.man_made', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#dfdbd4', // kolor
                            gamma: 0.8, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                },

                {
                    featureType: 'poi', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#b3dd9b', // kolor
                            gamma: 0.1, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                },

                {
                    featureType: 'poi.attraction', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#d2e4c8', // kolor
                            gamma: 0.1, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                },
                {
                    featureType: 'poi.park', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#d2e4c8', // kolor
                            gamma: 0.1, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                },


                {
                    featureType: 'transit.line', //tutaj wrzucasz typ
                    stylers: [
                        {
                            color: '#ffba7e', // kolor
                            gamma: 0.1, // gamma
                            hue: '#FF0000', // odcień
                            lightness: 80, //jasność, (-100,100)
                            saturation: 30, // saturacja (-100, 100)
                            weight: 3 //pixels
                        }
                    ]
                }

            ]
            var mapOptions = {
                zoom: 12,
                center: brooklyn,
                mapTypeControlOptions: {
                    mapTypeIds: [google.maps.MapTypeId.ROADMAP, MY_MAPTYPE_ID]
                },
                mapTypeId: MY_MAPTYPE_ID
            };

            map = new google.maps.Map(document.getElementById('map-canvas'),
                    mapOptions);

            var styledMapOptions = {
                name: 'Custom Style'
            };

            var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);

            map.mapTypes.set(MY_MAPTYPE_ID, customMapType);
        }

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

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