My directive "map" is encountering a namespace issue. The mapInit() function is working perfectly, but there seems to be an error with my OverlayView() object that I can't seem to resolve. This is the initial step outlined in the Google documentation for "Custom Overlays," yet it's not functioning as expected.
Error: "ReferenceError: MapSymbol is not defined"
app.directive('map', function() {
var linkFunction = function(scope, element, attrs) {
MapSymbol.prototype = new google.maps.OverlayView();
var map;
function initMap () {
map = new google.maps.Map($('#map')[0], {
center: {lat: -34.397, lng: 150.644},
zoom: 3
});
}
initMap();
};
return {
link: linkFunction,
templateUrl: 'app/templates/map.html'
};});