Get new jQuery plugins just once a week

×

location-picker

FavoriteLoadingAdd to favorites

January 8, 2015

A JQuery Location Picker plugin

location-picker | A simple jQuery Location Picker plugin directly from Google Maps

Features

Example Code

$('#us3').locationpicker({
location: {latitude: 46.15242437752303, longitude: 2.7470703125},	
radius: 300,
inputBinding: {
	latitudeInput: $('#us3-lat'),
	longitudeInput: $('#us3-lon'),
	radiusInput: $('#us3-radius'),
	locationNameInput: $('#us3-address')        
},
enableAutocomplete: true,
onchanged: function(currentLocation, radius, isMarkerDropped) {
	alert("Location changed. New location (" + currentLocation.latitude + ", " + currentLocation.longitude + ")");
}

Created by Logicify

Download

Example

http://logicify.github.io/jquery-locationpicker-plugin jQuery plugin

Location picker

JQuery Location Picker plugin

Location Picker

This plug-in allows finding and selecting a location on the Google map. Along with single point selection, it allows area selection by choosing a point and specifying a radius. The selection can be saved to any HTML input element or processed by Javascript with callback support.

An optional automatic address resolver can reverse geocode the selection to an address. The plug-in also supports searching by address typed into the bound input element which uses auto-complete feature from Google API to make the search process easier. In this case the marker will be automatically positioned on the map after successful address resolution.

Usage

The plug-in requires jQuery and the Google Maps API. Integration is pretty simple:

<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
// be careful to include the parameter "libraries=places"
<script type="text/javascript" src='http://maps.google.com/maps/api/js?sensor=false&libraries=places'></script>
<script src="js/locationpicker.jquery.js"></script>
<div id="somecomponent" style="width: 500px; height: 400px;"></div>
<script>
$('#somecomponent').locationpicker();
</script>

Documentation and Examples

Documentation along with examples available here.

Credits

location-picker

Related posts:

Selectable-js
Motioncaptcha
Uniform-js

To install using Bower
bower install jquery-locationpicker

http://logicify.github.io/jquery-locationpicker-plugin jQuery plugin

http://jquer.in/wp-content/uploads/2015/01/location-picker.jpg

jQuery plugin

Sign up for our weekly newsletter.

* We won't spam you ever