I seem to be facing an issue with the dom listener situated at the end of my Google Maps function in an external JavaScript file, resulting in a "google is not defined" console error. This error occurs when I navigate to another HTML page on my website that also accesses the script from the external file. I suspect that placing the DomListener outside the function is causing this problem, but moving it inside the function prevents the function from working properly. Can anyone guide me on the correct placement of this DomListener to resolve the error? Below is the snippet of my code.
Thank you for your assistance,
Anthony
function validateEmail() {
var email = form.emailaddress.value;
if (form.firstname.value == "") {
document.getElementById("emailInvalid").style.visibility = "visible";
return false;
} return true;
}
function initialize() {
var myLatlng1 = new google.maps.LatLng(-25.363882,150.044922);
var myLatlng2 = new google.maps.LatLng(-25.363882,152.044922);
var mapOptions = {
zoom: 6,
center: myLatlng1
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var contentString1 = 'Mott Park'
var contentString2 = 'Kilpa Park'
var infowindow = new google.maps.InfoWindow({
});
var marker1 = new google.maps.Marker({
position: myLatlng1,
map: map,
title: 'Park'
});
var marker2 = new google.maps.Marker({
position: myLatlng2,
map: map,
title: 'Water'
});
google.maps.event.addListener(marker1, 'click', function initialize() {
infowindow.close();
infowindow.setContent(contentString1);
infowindow.open(map, marker1);
});
google.maps.event.addListener(marker2, 'click', function initialize() {
infowindow.close();
infowindow.setContent(contentString2);
infowindow.open(map, marker2);
});
}
google.maps.event.addDomListener(window, 'load', initialize);