Lazy Load Google Maps API with jQuery – Lazymap

A lightweight jQuery plugin to lazy / late load Google Maps API with custom API key, zoom arrange and location.

Plugin Overview

Plugin: lazymap
Author: Martino Gabrielli
Licence: MIT Licence
Published: March 25, 2019
Repository: Fork on GitHub
Dependencies: jQuery 1.3.1 or Latest version
File Type: zip archive (HTML, CSS & JavaScript)
Package Size: 3.68 KB

How to Use jQuery Lazy Load Google Maps’s Plugin:

1. To getting started with lazymap plugin, load the jQuery and lazymap JavaScript files into HTML document.

<!-- jQuery -->
<script src=""></script>

<!-- Lazy Load Google Map Js -->
<script src="jquery.lazymap.js"></script>

2. Create a container (a div element) in which the map will be loaded. Also define the zoom arrange and map’s latitude & longitude data with the following mentioned data attributes.

<div class="map" data-lat="41.898743" data-lng="12.498862" data-zoom="11"></div>

3. Initialize the plugin in jQuery document ready function with that div selector and insert your Google Map API key into it.

            apiKey: '',
            culture: 'it'

Be the first to comment

Leave a Reply

Your email address will not be published.


three × 4 =

This site uses Akismet to reduce spam. Learn how your comment data is processed.