Show Nearby Places Using jQuery And Google Maps - WhatsNearby
File Size: | 19.6 KB |
---|---|
Views Total: | 6174 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

WhatsNearby is a simple-to-use jQuery plugin that shows nearby places and place details within a specified area using Google Places API.
How to use it:
1. Load the necessary jQuery library and Google Places API in the document.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
2. Download the load the JavaScript file WhatsNearby.js
after jQuery library.
<script src="WhatsNearby.js"></script>
3. Initialize the plugin to generate a default Google map on the webpage.
$("#container").whatsnearby({ address: "32 Saint-Charles Ouest, Longueuil, Qc, Canada" });
4. Specify the type of place you are searching for.
$("#container").whatsnearby({ address: "32 Saint-Charles Ouest, Longueuil, Qc, Canada", placesTypes: [ 'restaurant', 'cafe', 'gym' ] });
5. More options to customize the WhatsNearby plugin.
$("#container").whatsnearby({ "address": "", "lat": 45.509234, "lng": -73.559067, "width": 500, "height": 500, "zoom":8, "mapType": google.maps.MapTypeId.ROADMAP, "placeMainMarker": true, "mainMarkerIcon": "", "placesTypes": [], "placesTypesIcon": [], "excludePlacesTypes": [], "excludeByKeywords": [], "placesRadius": 500, "disableDefaultUI": false, "style": [], "scrollwheel":true, "backgroundColor": "#000000" });
This awesome jQuery plugin is developed by LaGrangeMtl. For more Advanced Usages, please check the demo page or visit the official website.