{"id":586,"date":"2018-09-21T16:49:19","date_gmt":"2018-09-21T11:19:19","guid":{"rendered":"http:\/\/demo.weblizar.com\/advanced-google-maps\/?page_id=586"},"modified":"2018-09-22T13:57:36","modified_gmt":"2018-09-22T08:27:36","slug":"multi-location-map","status":"publish","type":"page","link":"https:\/\/demo.weblizar.com\/advanced-google-maps\/multi-location-map\/","title":{"rendered":"Multi-Location Map"},"content":{"rendered":"            <style type=\"text\/css\">\r\n                #map {\r\n                    height: 700px;\r\n                    width: 1200;\r\n                }\r\n\r\n                .map-infos {\r\n                    background-color: #fff;\r\n                    width: 350px;\r\n                    border-radius: 4px;\r\n                    border: 1px solid#fff;\r\n                }\r\n\r\n                .map-infos p {\r\n                    color: #000;\r\n                }\r\n            <\/style>\r\n            <script type=\"text\/javascript\">\r\n                var infoWindow;\r\n\r\n                function initMap() {\r\n                    var map = new google.maps.Map(document.getElementById('map'), {\r\n                        center: new google.maps.LatLng(28.612393, 77.193441),\r\n                        zoom: 2,\r\n                                                draggable: true,\r\n                                                mapTypeId: 'roadmap',\r\n                                                scrollwheel: false,\r\n                        \r\n                        \/* Manage Controls and Positions *\/\r\n                                                mapTypeControl: true,\r\n                        mapTypeControlOptions: {\r\n                            style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,\r\n                            position: google.maps.ControlPosition.TOP_LEFT,\r\n                            mapTypeIds: ['roadmap', 'terrain', 'satellite', 'hybrid'],\r\n                        },\r\n                        \r\n                                                zoomControl: true,\r\n                        zoomControlOptions: {\r\n                            position: google.maps.ControlPosition.RIGHT_BOTTOM,\r\n                        },\r\n                        \r\n                                                streetViewControl: true,\r\n                        streetViewControlOptions: {\r\n                            position: google.maps.ControlPosition.LEFT_TOP,\r\n                        },\r\n                        \r\n                                                fullscreenControl: true,\r\n                        fullscreenControlOptions: {\r\n                            position: google.maps.ControlPosition.LEFT_BOTTOM,\r\n                        },\r\n                                                \/* End of Manage Controls *\/\r\n\r\n                    });\r\n                    infoWindow = new google.maps.InfoWindow;\r\n\r\n                    \/* Set the map to 45\u00b0 Imagery *\/\r\n                                        map.setTilt(45);\r\n                    \r\n                    var c_icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Map-Marker-Marker-Inside-Azure.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    \r\n                    \/* Set Geolocation as center *\/\r\n                    \r\n                    \/* Set the map\"s style to the initial value of the selector. *\/\r\n                    map.setOptions({styles: styles[\"night\"]});\r\n\r\n                    var i;\r\n                    var markers = [];\r\n\r\n                    var each_icon = {\r\n                        url: \"\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Map-Marker-Marker-Inside-Pink.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(19.0482366, -99.36492420000002),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'Mexico City',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/maxico.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>Mexico City  <\/p>\" +\r\n                        \"<p>Mexico City is the densely populated high-altitude capital of Mexico.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>Mexico City, Mexico<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 0, html);\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/brazil.jpg\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(34.06756427010728, -83.98145372989268),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'Brazil',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/brazil.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>Brazil  <\/p>\" +\r\n                        \"<p>Brazil is a vast South American country.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>3185 Woodward Crossing Blvd, Buford, GA 30519, USA<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 1, html);\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Map-Marker-Marker-Outside-Pink.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(8.2929599, 74.86099999999999),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'kerla india',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/kerla.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>kerla india  <\/p>\" +\r\n                        \"<p>Kerala, a state on India tropical Malabar Coast, has nearly 600km of Arabian Sea shoreline.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>Kerala, India<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 2, html);\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Map-Marker-Marker-Inside-Pink.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(26.8661172, 70.83709720000002),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'Jaisalmer, Rajasthan',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/jaisalmer.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>Jaisalmer, Rajasthan  <\/p>\" +\r\n                        \"<p>Jaisalmer is a former medieval trading center and a princely state in the western Indian state of Rajasthan.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>Jaisalmer, Rajasthan 345001, India<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 3, html);\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Map-Marker-Marker-Inside-Azure.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(19.0746347197085, 72.87630691970844),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'Mumbai',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/cst.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>Mumbai  <\/p>\" +\r\n                        \"<p>Mumbai (formerly called Bombay) is a densely populated city on India\u2019s west coast.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>Lower Parel, Friends Colony, Hallow Pul, Kurla, Mumbai, Maharashtra 400070, India<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 4, html);\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Map-Marker-Marker-Outside-Chartreuse-icon.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(28.597225, 77.22504389999995),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'Delhi',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/delhi.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>Delhi  <\/p>\" +\r\n                        \"<p>Delhi, India\u2019s capital territory, is a massive metropolitan area in the country\u2019s north.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>India Gate, New Delhi, Delhi, India<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 5, html);\r\n\r\n                    \r\n                    var icon = {\r\n                        url: \"http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/MapMarker_Bubble_Pink.png\",\r\n                        scaledSize: new google.maps.Size(32, 32),\r\n                        origin: new google.maps.Point(0, 0),\r\n                        anchor: new google.maps.Point(16, 32)\r\n                    };\r\n\r\n                    marker = new google.maps.Marker({\r\n                        position: new google.maps.LatLng(25.096559, 75.76982989999999),\r\n                        map: map,\r\n                                                icon: icon,\r\n                                                title: 'Kota, Rajasthan, India',\r\n                    });\r\n\r\n                \/\/ Push the marker to our array of markers.\r\n                markers.push(marker);\r\n\r\n                                        var html = \"<div class='wl_agm' id='iw-container'>\" +\r\n                        \"<div class='map-infos'>\" +\r\n                        \"<div class='marker-info'>\" +\r\n                        \"<img src='http:\/\/demo.weblizar.com\/advanced-google-maps\/wp-content\/uploads\/sites\/121\/2018\/09\/Garadiya-Mahadev-Kota.jpg' alt='Porcelain Factory of Vista Alegre' height='115' width='83'>\" +\r\n                        \"<p class='m_title'>Kota, Rajasthan, India  <\/p>\" +\r\n                        \"<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.<\/p>\" +\r\n                        \"<p class='add-header'>Address<\/p>\" +\r\n                        \"<p class='addess_'><i class='fa fa-map icon_f'><\/i>Kota, Rajasthan, India<\/p>\" +\r\n                        \"<\/div>\" + \"<\/div>\" + \"<\/div>\";\r\n                    \r\n                    \/* process multiple info windows *\/\r\n                    (function (marker, i, html) {\r\n                        \/* add click event *\/\r\n                        google.maps.event.addListener(marker, 'click', function () {\r\n                            infowindow = new google.maps.InfoWindow({\r\n                                content: html,\r\n                                maxWidth: 600\r\n                            });\r\n\r\n                            \/* Additional Js for infoWindow Css *\/\r\n                            google.maps.event.addListener(infowindow, 'domready', function () {\r\n\r\n                                \/* Reference to the DIV that wraps the bottom of infowindow *\/\r\n                                var iwOuter = jQuery('.gm-style-iw');\r\n                                iwOuter.css({'top': '27px'});\r\n\r\n                                \/* Since this div is in a position prior to .gm-div style-iw.\r\n                                 * We use jQuery and create a iwBackground variable,\r\n                                 * and took advantage of the existing reference .gm-style-iw for the previous div with .prev().\r\n                                *\/\r\n                                var iwBackground = iwOuter.prev();\r\n\r\n                                \/* Removes background shadow DIV *\/\r\n                                iwBackground.children(':nth-child(2)').css({'display': 'none'});\r\n\r\n                                \/* Removes white background DIV *\/\r\n                                iwBackground.children(':nth-child(4)').css({'display': 'none'});\r\n\r\n                                \/* Moves the infowindow 115px to the right. *\/\r\n                                iwOuter.parent().parent().css({left: ''});\r\n\r\n                                \/* Moves the shadow of the arrow 76px to the left margin. *\/\r\n                                iwBackground.children(':nth-child(1)').css({'display': 'red'});\r\n\r\n                                iwBackground.children(':nth-child(1)').attr('style', function (i, s) {\r\n                                    return s + 'bottom: 76px !important;'\r\n                                });\r\n\r\n                                \/* Reference to the div that groups the close button elements. *\/\r\n                                var iwCloseBtn = iwOuter.next();\r\n\r\n                                \/* Apply the desired effect to the close button *\/\r\n                                iwCloseBtn.css({right: '54px', top: '43px'});\r\n\r\n                                \/* If the content of infowindow not exceed the set maximum height, then the gradient is removed. *\/\r\n                                if (jQuery('.iw-content').height() < 140) {\r\n                                    jQuery('.iw-bottom-gradient').css({display: 'none'});\r\n                                }\r\n\r\n                                \/* The API automatically applies 0.7 opacity to the button after the mouseout event. This function reverses this event to the desired value. *\/\r\n                                iwCloseBtn.mouseout(function () {\r\n                                    jQuery(this).css({opacity: '1'});\r\n                                });\r\n                            });\r\n\r\n                            infowindow.open(map, marker);\r\n                        });\r\n                    })(marker, 6, html);\r\n\r\n                    \r\n                    \/* Dynamically show\/hide markers *\/\r\n                    var SearchDiv = document.getElementById('wl_agm_place_category');\r\n                    google.maps.event.addDomListener( SearchDiv, 'change', function() {\r\n                        var current_cat_id = document.getElementById('wl_agm_place_category').value;\r\n                        cat_id = current_cat_id;\r\n\r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[0].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[0].setVisible(true);\r\n                            } else {\r\n                                markers[0].setVisible(false);\r\n                            } \r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[1].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[1].setVisible(true);\r\n                            } else {\r\n                                markers[1].setVisible(false);\r\n                            } \r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[2].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[2].setVisible(true);\r\n                            } else {\r\n                                markers[2].setVisible(false);\r\n                            } \r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[3].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[3].setVisible(true);\r\n                            } else {\r\n                                markers[3].setVisible(false);\r\n                            } \r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[4].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[4].setVisible(true);\r\n                            } else {\r\n                                markers[4].setVisible(false);\r\n                            } \r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[5].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[5].setVisible(true);\r\n                            } else {\r\n                                markers[5].setVisible(false);\r\n                            } \r\n                                                    if ( cat_id == '' ) {            \r\n                                markers[6].setVisible(true);\r\n                            } else if ( cat_id == 0 ) {\r\n                                markers[6].setVisible(true);\r\n                            } else {\r\n                                markers[6].setVisible(false);\r\n                            } \r\n                                            });\r\n                }\r\n\r\n                function handleLocationError(browserHasGeolocation, infoWindow, pos) {\r\n                    infoWindow.setPosition(pos);\r\n                    infoWindow.setContent(browserHasGeolocation ?\r\n                        'Error: The Geolocation service failed.' :\r\n                        'Error: Your browser doesn\\'t support geolocation.');\r\n                    infoWindow.open(map);\r\n                }\r\n            <\/script>\r\n                    <script type=\"text\/javascript\">\r\n            \/* Map's Style Themes Data *\/\r\n            var styles = {\r\n                default: null,\r\n\r\n                \/* Night Theme *\/\r\n                night: [\r\n                    {elementType: \"geometry\", stylers: [{color: \"#242f3e\"}]},\r\n                    {elementType: \"labels.text.stroke\", stylers: [{color: \"#242f3e\"}]},\r\n                    {elementType: \"labels.text.fill\", stylers: [{color: \"#746855\"}]},\r\n                    {\r\n                        featureType: \"administrative.locality\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#d59563\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#d59563\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#263c3f\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#6b9a76\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#38414e\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#212a37\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#9ca5b3\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#746855\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#1f2835\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#f3d19c\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#2f3948\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.station\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#d59563\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#17263c\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#515c6d\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#17263c\"}]\r\n                    }\r\n                ],\r\n\r\n                \/* Silver Theme *\/\r\n                silver: [\r\n                    {\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#f5f5f5\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.icon\",\r\n                        stylers: [{visibility: \"off\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#616161\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#f5f5f5\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.land_parcel\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#bdbdbd\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#eeeeee\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#757575\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#e5e5e5\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#9e9e9e\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#ffffff\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.arterial\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#757575\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#dadada\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#616161\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.local\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#9e9e9e\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.line\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#e5e5e5\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.station\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#eeeeee\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#c9c9c9\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#9e9e9e\"}]\r\n                    }\r\n                ],\r\n\r\n                \/* Retro Theme *\/\r\n                retro: [\r\n                    {elementType: \"geometry\", stylers: [{color: \"#ebe3cd\"}]},\r\n                    {elementType: \"labels.text.fill\", stylers: [{color: \"#523735\"}]},\r\n                    {elementType: \"labels.text.stroke\", stylers: [{color: \"#f5f1e6\"}]},\r\n                    {\r\n                        featureType: \"administrative\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#c9b2a6\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.land_parcel\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#dcd2be\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.land_parcel\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#ae9e90\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"landscape.natural\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#dfd2ae\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#dfd2ae\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#93817c\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"geometry.fill\",\r\n                        stylers: [{color: \"#a5b076\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#447530\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#f5f1e6\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.arterial\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#fdfcf8\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#f8c967\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#e9bc62\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway.controlled_access\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#e98d58\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway.controlled_access\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#db8555\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.local\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#806b63\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.line\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#dfd2ae\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.line\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#8f7d77\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.line\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#ebe3cd\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.station\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#dfd2ae\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"geometry.fill\",\r\n                        stylers: [{color: \"#b9d3c2\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#92998d\"}]\r\n                    }\r\n                ],\r\n\r\n                \/* Dark Theme *\/\r\n                dark: [\r\n                    {\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#212121\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.icon\",\r\n                        stylers: [{visibility: \"off\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#757575\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#212121\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#757575\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.country\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#9e9e9e\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.land_parcel\",\r\n                        stylers: [{visibility: \"off\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.locality\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#bdbdbd\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#757575\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#181818\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#616161\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#1b1b1b\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"geometry.fill\",\r\n                        stylers: [{color: \"#2c2c2c\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#8a8a8a\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.arterial\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#373737\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#3c3c3c\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway.controlled_access\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#4e4e4e\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.local\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#616161\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#757575\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#000000\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#3d3d3d\"}]\r\n                    }\r\n                ],\r\n\r\n                \/* Aubergine Theme *\/\r\n                aubergine: [\r\n                    {\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#1d2c4d\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#8ec3b9\"}]\r\n                    },\r\n                    {\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#1a3646\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.country\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#4b6878\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.land_parcel\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#64779e\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"administrative.province\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#4b6878\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"landscape.man_made\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#334e87\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"landscape.natural\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#023e58\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#283d6a\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#6f9ba5\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#1d2c4d\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"geometry.fill\",\r\n                        stylers: [{color: \"#023e58\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"poi.park\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#3C7680\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#304a7d\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#98a5be\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#1d2c4d\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#2c6675\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"geometry.stroke\",\r\n                        stylers: [{color: \"#255763\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#b0d5ce\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"road.highway\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#023e58\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#98a5be\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit\",\r\n                        elementType: \"labels.text.stroke\",\r\n                        stylers: [{color: \"#1d2c4d\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.line\",\r\n                        elementType: \"geometry.fill\",\r\n                        stylers: [{color: \"#283d6a\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"transit.station\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#3a4762\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"geometry\",\r\n                        stylers: [{color: \"#0e1626\"}]\r\n                    },\r\n                    {\r\n                        featureType: \"water\",\r\n                        elementType: \"labels.text.fill\",\r\n                        stylers: [{color: \"#4e6d70\"}]\r\n                    }\r\n                ]\r\n            };\r\n        <\/script>\r\n\t        <script async defer\r\n                src=\"https:\/\/maps.googleapis.com\/maps\/api\/js?key=AIzaSyBkVUhjF3pcx-9b5himDwA-PpFMkUZyrUg&callback=initMap&language=en\"><\/script>\r\n\t<div class=\"wl_agm container\">\r\n    <div id=\"map\" class=\"wl_agm_map\"><\/div>\r\n    <div class=\"wl_agm_filter_wrappers\" id=\"wl_agm_filter_wrappers\" style=\"display:none;\">\r\n        <div class=\"wl_agm_before_listing\">Filter Locations<\/div>\r\n                <div class=\"categories_filter\">\r\n            <select data-filter=\"dropdown\" data-name=\"category\" id=\"wl_agm_place_category\" name=\"wl_agm_place_category\" class=\"custom-select\">\r\n                <option value=\"0\">Select Category<\/option>\r\n                                    <option value=\"81\">Apartment <\/option>\r\n                                    <option value=\"80\">Office <\/option>\r\n                                    <option value=\"79\">School <\/option>\r\n                                    <option value=\"78\">Shops <\/option>\r\n                                    <option value=\"77\">Store <\/option>\r\n                            <\/select>\r\n        <\/div>\r\n            <\/div>\r\n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":9,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-586","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/pages\/586","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/comments?post=586"}],"version-history":[{"count":11,"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/pages\/586\/revisions"}],"predecessor-version":[{"id":763,"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/pages\/586\/revisions\/763"}],"wp:attachment":[{"href":"https:\/\/demo.weblizar.com\/advanced-google-maps\/wp-json\/wp\/v2\/media?parent=586"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}