I have a separate .js page with this code
var map;
$(document).ready(function () {
InitializeMap();
});
function InitializeMap() {
var latlng = new google.maps.LatLng(-33.956009, 25.601481);
var myOptions = {
zoom: 15,
center: latlng,
mapTypeControl: true,
mapTypeControlOptions: { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU },
navigationControl: true,
navigationControlOptions: { style: google.maps.NavigationControlStyle.SMALL },
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), myOptions);
}
window.onload = InitializeMap;
var bikeLayer = new google.maps.InfoWindow();
bikeLayer.setMap(map);
var companyPos = new google.maps.LatLng(-33.956009, 25.601481);
var companyMarker = new google.maps.Marker({
position: companyPos,
map: map,
title: "Erica",
zIndex: 3
});
google.maps.event.addListener(companyMarker, 'click', function () {
bikeLayer.open(map, companyMarker);
});
i get the error whn running my page
"Uncaught ReferenceError: $ is not defined "
in this line
$(document).ready(function () {