docs/_includes/map.html

<div id="map" class="uk-width-1-1 uk-height-large uk-margin-medium-top uk-margin-medium-bottom"></div>
<script>
  window.mapData = {"latitude": {{ include.latitude }},"longitude": {{ include.longitude }}, "zoom": {{ include.zoom}}};

  var lightStyles = [{"featureType":"water","elementType":"geometry","stylers":[{"color":"#e9e9e9"},{"lightness":17}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#f5f5f5"},{"lightness":20}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#ffffff"},{"lightness":17}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#ffffff"},{"lightness":29},{"weight":0.2}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":18}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":16}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#f5f5f5"},{"lightness":21}]},{"featureType":"poi.park","elementType":"geometry","stylers":[{"color":"#dedede"},{"lightness":21}]},{"elementType":"labels.text.stroke","stylers":[{"visibility":"on"},{"color":"#ffffff"},{"lightness":16}]},{"elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#333333"},{"lightness":40}]},{"elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#f2f2f2"},{"lightness":19}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#fefefe"},{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#fefefe"},{"lightness":17},{"weight":1.2}]}]

  function initMap() {
    var myOptions = {
      scrollwheel: false,
      //draggable: false,
      panControl: false,
      disableDefaultUI: true,
      zoom: window.mapData.zoom,
      maxZoom: window.mapData.zoom,
      minZoom: window.mapData.zoom,
      center: new google.maps.LatLng(window.mapData.latitude, window.mapData.longitude),
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      styles: lightStyles
    };

    var map = new google.maps.Map(document.getElementById('map'), myOptions);

    var marker = new google.maps.Marker({
      map: map,
      position: new google.maps.LatLng(window.mapData.latitude, window.mapData.longitude),
      icon: {
          url: "/assets/img/location.svg",
          size: new google.maps.Size(28, 38),
          scaledSize: new google.maps.Size(28, 38)
        }
    });

    google.maps.event.addDomListener(window, 'resize', function() {
      map.setCenter(myOptions.center);
    });
  }
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key={{ site.google_maps_api_key }}&amp;callback=initMap"></script>