Last active
May 26, 2020 00:54
-
-
Save wkw/83ce9c8ee97a9c2e58b9 to your computer and use it in GitHub Desktop.
Geolocate Address with Google Maps API. Have used this code in WordPress admin on a few projects. Not overly generalized or documented in this version.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * | |
| * Adds Geolocate button for Locations CPT custom address field | |
| * On button click, gathers address field components and looks up the geolocation with google | |
| * maps api. | |
| * | |
| * DEPENDENCIES: | |
| * must load //maps.googleapis.com/maps/api/js?sensor=false&key=<YOUR-API-KEY> | |
| */ | |
| /* jshint ignore:start */ | |
| ;(function($,window,undefined){ | |
| var $fld; // geolocation coordinates field as jquery object | |
| var err_msgs = { | |
| bad_addrs: "Not enough address info entered to lookup geo-coordinates", | |
| lookup_failed: "Geocoding lookup failed. Please verify address values", | |
| over_limit: "Google Maps Error: OVER LIMIT" | |
| }; | |
| function getAddress(){ | |
| var addr = $('input[name="cfs[input][17][value]"]').val() | |
| ,city = $('input[name="UNDEFINED"]').val() | |
| ,state = $('input[name="UNDEFINED"]').val() | |
| ,zip = $('input[name="UNDEFINED"]').val() | |
| ,city_st_zip = $('input[name = "cfs[input][19][value]"]').val(); | |
| if( city_st_zip === '' ){ | |
| if( city == '' && state == '' && zip == '' ){ | |
| return false; | |
| }else{ | |
| city_st_zip = addr + city + ', ' + state + ' ' + zip; | |
| } | |
| } | |
| var address = addr + ', ' + city_st_zip; | |
| console.log(address); | |
| return address; | |
| } | |
| // return geocode input field jquery obj | |
| function $geoinput(){ | |
| return $('input[name="cfs[input][32][value]"]'); | |
| } | |
| function clear_geo_field(){ | |
| $geoinput().val(''); | |
| } | |
| // ready | |
| $(function(){ | |
| var address; | |
| var btn_html = '<button id="geobtn" style="height:25px;padding:3px;font-size:14px;">Geolocate Address</button'; | |
| $fld = $geoinput(); | |
| //resize input field | |
| $fld.width(300); | |
| //add button | |
| $fld.parent().append(btn_html); | |
| $("#geobtn").on('click',function(evt){ | |
| evt.preventDefault(); | |
| address = getAddress(); | |
| if( !address ){ | |
| alert(err_msgs.bad_addrs); | |
| return false; | |
| } | |
| var geocoderRequest = {address:address, region:'us'}; | |
| var geocoder = new google.maps.Geocoder(); | |
| // callback func for geocoder | |
| var geoCallback = function(geocoderResultArray, status){ | |
| var r = geocoderResultArray; | |
| //console.log(gra=geocoderResultArray, "status=" + status); | |
| switch(status){ | |
| case google.maps.GeocoderStatus.ZERO_RESULTS: | |
| case google.maps.GeocoderStatus.INVALID_REQUEST: | |
| alert(err_msgs.lookup_failed + " (zero results)"); | |
| break; | |
| case google.maps.GeocoderStatus.ERROR: | |
| alert("Google maps Error"); | |
| break; | |
| case google.maps.GeocoderStatus.OVER_QUERY_LIMIT: | |
| alert(err_msgs.over_limit); | |
| break; | |
| case google.maps.GeocoderStatus.REQUEST_DENIED: | |
| case google.maps.GeocoderStatus.UNKNOWN_ERROR: | |
| console.warn("Error looking up map search input:" + status); | |
| break; | |
| case google.maps.GeocoderStatus.OK: | |
| if( r.length > 0 ){ | |
| // create comma-separated lat/lng string | |
| var ll = String(r[0].geometry.location.lat()) + ',' | |
| + String(r[0].geometry.location.lng()); | |
| // set geo field's value | |
| $geoinput().val(ll); | |
| }else{ | |
| alert(err_msgs.lookup_failed); | |
| } | |
| } | |
| if( status !== google.maps.GeocoderStatus.OK ) | |
| clear_geo_field(); | |
| }; | |
| // | |
| // == Execute the maps geocode request == | |
| // | |
| geocoder.geocode(geocoderRequest, geoCallback); | |
| return false; // stop event propagation | |
| });// on.('click') | |
| });//doc ready | |
| }(jQuery,window)); | |
| /* jshint ignore:end */ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment