<!DOCTYPE html>
<html lang="en" {{ HTML_ATTRS }}>
  <head {{ HEAD_ATTRS }}>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <!-- Google Tag Manager -->
    <!-- <script>(function (w, d, s, l, i) {
        w[l] = w[l] || []; w[l].push({
          'gtm.start':
            new Date().getTime(), event: 'gtm.js'
        }); var f = d.getElementsByTagName(s)[0],
          j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
            'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
      })(window, document, 'script', 'dataLayer', 'GTM-MCP6VN7');</script> -->
    <!-- End Google Tag Manager -->
    {{ HEAD }}
    <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v13.0&appId=267799105222528&autoLogAppEvents=1" nonce="ApUsWsoe"></script> 

</head>
<body {{ BODY_ATTRS }}>
    {{ APP }}
<h1>Location on google map</h1>

<div id="googleMap" style="width:100%;height:400px;"></div>

<script>
function myMap() {
var mapProp= {
  center:new google.maps.LatLng(22.842218174247584, 88.65963753075175),
  zoom:18,
};
var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
}
</script>
<!-- <script>
  (function(d, s, id) {
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) return;
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));

    window.fbAsyncInit = function(){  // this gets triggered when FB object gets initialized
           console.log("FB Object initiated");
           FB.XFBML.parse(); // now we can safely call parse method
      };

</script> -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDs2g5yTVsF_c2kIbk_9wZSosL5hs7uY_8&callback=myMap"></script>
<div id="fb-root"></div>
</body>
</html>
