Question

I’m currently use a new system for my weather website and I’m getting the following error:

Uncaught TypeError: Cannot read property '__e3_' of undefined

Xe%7Bmain,places,weather%7D.js:18
Ve%7Bmain,places,weather%7D.js:21
P.addListener%7Bmain,places,weather%7D.js:18
T.(anonymous function).bindTo%7Bmain,places,weather%7D.js:27
initializejavascript.js:109
(anonymous function)javascript.js:4
f.Callbacks.ojquery.min.js:2
f.Callbacks.p.fireWithjquery.min.js:2
e.extend.readyjquery.min.js:2
c.addEventListener.B

Here’s the content in my javascript.js file which I include in my header.php (<script src="javascript.js" type="text/javascript"></script>):

$(document).ready(function() {
    initialize();
});

var elevator;
var geocoder;
var map;

function initialize() {

    // KONFIGURATION: Geocoding
    geocoder = new google.maps.Geocoder();

    // KONFIGURATION: Filnamn
    var weatherdata = 'fetch-information/fetch-weatherdata.php';

    // KONFIGURATION: Datum
    var date = new Date();
    var datetime = date.getFullYear() + '-' + 
                  (date.getMonth() < '10' ? '0' + date.getMonth() : date.getMonth()) + '-' +
                  (date.getDay() < '10' ? '0' + date.getDay() : date.getDay()) + ', ' +
                  (date.getHours() < '10' ? '0' + date.getHours() : date.getHours()) + ':' +
                  (date.getMinutes() < '10' ? '0' + date.getMinutes() : date.getMinutes()) + ':' +
                  (date.getSeconds() < '10' ? '0' + date.getSeconds() : date.getSeconds());

    // KONFIGURATION: Hämta adress
    var address = 'Karlstad, Sverige';

    // KONFIGURATION: Inställningar för kartan
    var myOptions = {
        streetViewControl: false,
        overviewMapControl: true,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };


    // MOLNAKTIVITET
    var cloudLayer = new google.maps.weather.CloudLayer();
    cloudLayer.setMap(map);



    /**********************************************
    **    THE CODE BELOW IS CAUSING THE ERROR    **
    **********************************************/

    // HÖJD ÖVER / UNDER HAVSYTAN
    elevator = new google.maps.ElevationService();
    google.maps.event.addListener(map, 'click', getElevation);


    /* ** ** ** ** ** */


    // GOOGLE PLACES API
    var input = document.getElementById('googlemaps-search');
    var autocomplete = new google.maps.places.Autocomplete(input);

    autocomplete.bindTo('bounds', map);
    google.maps.event.addListener(autocomplete, 'place_changed', function() {
        var place = autocomplete.getPlace();
        alert(place.geometry.location);
    });

    /**********************************************
    **    THE CODE ABOVE IS CAUSING THE ERROR    **
    **********************************************/



    /* ** ** ** ** ** */


    // GEOCODING
    geocoder.geocode({'address' : address}, function(results, status) {

        // KONTROLL
        if(status == google.maps.GeocoderStatus.OK) {

            // KONFIGURATION: Ta bort ( och ) före och efter koordinaterna
            var old_latlong = '' + results[0].geometry.location + '';
            var new_latlong = old_latlong.substring(1, old_latlong.length - 1).replace(' ', '');

            // CENTERRING
            map.setCenter(results[0].geometry.location);

            // MARKERING: Adress
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });

            // AJAX: Hämta den angivna filen
            $.ajax({
                    url: weatherdata + '?coordinates=' + new_latlong,

                    success: function() {
                                         console.log(datetime + ': Hämtningen av väderprognosen och den övriga informationen lyckades');
                                         $('.content-search').show();
                                         $('#load-weather').load(weatherdata + '?coordinates=' + new_latlong);
                                        },

                    error: function() {
                                       console.error(datetime + ': Hämtningen av väderprognosen och den övriga informationen misslyckades');
                                       $('#load-weather').hide();
                                       $('.content-search').hide();
                                       $('#message-error').show();
                                      }
                   });


        // KONTROLL
        } else {

            // FELMEDDELANDE
            alert('Kunde inte hämta data på grund av följande fel: ' + status);
        }

    });


    /* ** ** ** ** ** */


    // KARTA
    var map = new google.maps.Map(document.getElementById('weather-map'), myOptions);

}



/** ** ** ** ** ** ** ** ** ** ** ** **/



function getElevation(event) {
    var locations = [];
    var clickedLocation = event.latLng;
    locations.push(clickedLocation);

    var positionalRequest = {
        'locations': locations
    }

    elevator.getElevationForLocations(positionalRequest, function(results, status) {
        if(status == google.maps.ElevationStatus.OK) {
            var s = results[0].elevation;

            if(results[0]) {
                if(('' + parseInt(s)).charAt(0) == '-') {
                    $('#elevation').html('Cirka ' + number_format(('' + parseInt(s)).substring(1)) + ' meter under havsytan');
                } else {
                    $('#elevation').html('Cirka ' + number_format(parseInt(s)) + ' meter över havsytan');
                }
            } else {
                alert('Inget resultat hittades');
            }
        } else {
            alert('Det gick inte att hitta höjdskillnaden på grund av följande: ' + status);
        }
    });
}

The problem is that the system is quite the same as in my previous system and I have the same “code structure” on both of them and still I’m getting this error message on the new system. I don’t know why I’m getting it so I’m asking you know: how can I fix my problem?

Thanks in advance.

Answer 1

When I moved the map definition to a point before the marked buggy code, it worked. I added the var map = new google.map.Map to right after the map options.

  var myOptions = {
     streetViewControl: false,
     overviewMapControl: true,
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById('weather-map'), myOptions);

// MOLNAKTIVITET
var cloudLayer = new google.maps.weather.CloudLayer();
cloudLayer.setMap(map);



/**********************************************
**    THE CODE BELOW IS CAUSING THE ERROR    **
**********************************************/

// HÖJD ÖVER / UNDER HAVSYTAN
elevator = new google.maps.ElevationService();
google.maps.event.addListener(map, 'click', getElevation);