I am using Google Autocomplete plugin on Wordpress with contact form 7. I input the API from Google Cloud.
I would really like to bias the results to a particular city and radius as explained here - https://www.youtube.com/watch?v=bv1p4s_d8OM
I'm getting a bit lost in exactly which code is needed and where to place it. My best guess would be the custom.js file for Google Autocomplete plugin?
Existing code of custom.js for plugin:
function autocomplet_set_google_autocomplete(){ jQuery(input_fields).each(function(){
let autocomplete= new google.maps.places.Autocomplete(
/** @type {HTMLInputElement} */(this));
autocomplete.addListener("place_changed", fillInAddress);
function fillInAddress() {
const place = autocomplete.getPlace();
jQuery(input_fields).trigger("change");
}
});
}
jQuery(window).on('load',function () {
autocomplet_set_google_autocomplete();
});
Added code according to video:
function autocomplet_set_google_autocomplete(){
jQuery(input_fields).each(function(){
let autocomplete= new google.maps.places.Autocomplete(
/** @type {HTMLInputElement} */(this));
const map = new google.maps.Map (document.getElementById("map"), {
center: { lat:43.22030, lng: 79.49021},
const sw = { lat:43°09'13.1 , lng:80°26'00.7 };
const ne = { lat: 43°39'38.0, lng:79°28'47.2 };
const cornerBounds = new google.maps.LatLngBounds (sw, ne);
autocomplete.setBounds(cornerBounds);
autocomplete.setOptions ({strictBounds: true});
autocomplete.setComponentRestrictions({country: 'CA'});
autocomplete.addListener("place_changed", fillInAddress);
function fillInAddress() {
const place = autocomplete.getPlace();
jQuery(input_fields).trigger("change");
}
});
}
jQuery(window).on('load',function () {
autocomplet_set_google_autocomplete();
});