Simple jQuery Wrapper For Google Maps API V3 - jMap

jMap is a simple-to-use jQuery plugin that makes it easy to embed Google Maps into your website with extra functions.

How to use it:

1. Include the necessary jQuery library and Google Maps API V3 into the webpage.

<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="//maps.google.com/maps/api/js?sensor=falsen"></script>

2. Include jMap plugin after jQuery library.

<script src="src/jquery.jmap.js"></script>

3. Create an empty container for the Google Maps.

<div id="map"></div>

4. Call the plugin to embed the Google Maps into the container you just created.

$("#map").jMap({
  // OPTIONS
});

5. All the default options.

• lat: 62.10: the default center latitude
• lng: 10.10: the default center longitude
• height : 350: the default height of the canvas when no css height is set, will be ignored if A/R is ture
• centerResize: true: always keep the map center on resize
• aspectRatio : '16/9': make sure the map keeps its aspect ratio. accepts: string 'a/r' or boolean false
• zoom: 16: the default zoom level
• type: 'roadmap': the map type. accepts: 'roadmap', 'terrain', 'hybrid' or 'satellite'
• markers : null: the markers of the map
• centerMarkers: true: if the map should be centered around markers
• geoCenter: false: will be overridden if centerMarkers = true
• debug: false: whether or not to show debug messages
• beforeMapInit: null: callback before the map renders
• afterMapInit: null: callback after the map has rendered
• beforeMarkerAdd : null: before markers are added to the map
• afterMarkerAdd  : null: after markers have been added to the map
• beforeCenter: null: before center is set
• afterCenter: null: after center is set
• beforeGeoCenter: null: before geocenter is set
• afterGeoCenter: null: after geocenter is set

---

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