jquery-geolocation-edit

Let's say you want to enter or edit geographic location(s). Do you feel that instead of editing Latitude and Longitude manually it would be nicer to have simple Google Maps window for such thing? Maybe even geocoding of typed address? If you answered yes, read on.

Download

Examples

Required params are only coordinates fields, which can be pre-populated. Hint: drag marker on map.

CSS:

#map { width:320px; height:200px; }

JavaScript:

$("#map").geolocate({
	lat: "#lat",
	lng: "#lng"
});

Fields can be hidden (which is kind of a point of this plugin) and you can pass any additional options for Google Maps API, both for map (defined here) and marker (defined here).

$("#map2").geolocate({
	lat: "#lat2",
	lng: "#lng2",
	mapOptions: {
		disableDefaultUI: true,
		mapTypeId: "satellite",
		zoom: 13
	},
	markerOptions: {
		title: "This is your selected location"
	}
});

Geolocating from address

You can get position from address field (or multiple fields). Location will populate when you change text field. Hint: complete address below and press Enter or focus-out.

Note: Geocoding is an expensive operation, and there are Google Geocoding API usage limits for non-Premier users, so be sure not to do this automatically on every page load.

$("#map3").geolocate({
	lat: "#lat3",
	lng: "#lng3",
	address: ["#address3"]
});

Geolocating programmatically

Geocoding happens on jQuery "change" event (on any of address's input fields), but you can call it programmatically by passing just method name (after initialization).

$("#map3").geolocate("callGeocoding");

Options