Easy jQuery Plugin For Manipulating Google Maps - easyGoogleMap

easyGoogleMap is a jQuery plugin for embedding Google Maps configured by Html5 data attributes into any web page.

How to use it:

1. Include the Google Maps JavaScript API on your web page. You will also need jQuery installed on the page. You can get a Google API key here.

<script src="//maps.googleapis.com/maps/api/js?v=3.6&sensor=false&callback=initialize&key=XXX"></script>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

2. Download the plugin and include the easyGoogleMap.js script after jQuery library.

<script src="js/easyGoogleMap.js"></script>

3. Put HTML onto the page to set the map address and marker.

<div class="quickGoogleMap" id="contactGoogleMap"
     data-address="ADDRESS HERE"
     data-show-marker="1"
     data-marker-lat="52.440983"
     data-market-long="-1.865927"
     data-type="ROADMAP"
     data-zoom="13">
</div>

4. With info window on map pin click:

<div class="quickGoogleMap" id="contactGoogleMap" 
     data-address="ADDRESS HERE"
>
  <h2>My info window title</h2>
  <p>Some info window text</p>
</div>

5. Auto show the info window without pin click:

<div class="quickGoogleMap" id="contactGoogleMap"
     data-address="ADDRESS HERE"
     data-auto-show-infowindow="1">
  <h2>My inf window title</h2>
  <p>Some info window text</p>
</div>

6. All HTML5 data attributes.

• data-address: The postal data address that the map is to center on
• data-show-marker: 1 or 0. Set to determine if a map pin is to be displayed or not
• data-marker-lat & data-marker-long: If you would like the marker to go on a different location than the map address then you can define it here.
• data-type: The style of map to display. Options: ROADMAP, SATELLITE, HYBRID, TERRAIN
• data-zoom: How far to zoom in on the map. Set between 1 and 14
• data-auto-show-infowindow: 1 or 0. If you have set html for an info window popup then you can use this to display the popup right away without the need for the map pin to be clicked.

---

This awesome jQuery plugin is developed by scorchsoft. For more Advanced Usages, please check the demo page or visit the official website.