getting an error as first child of undefined when using google maps

Question

getting an error when using google maps multiple times with the following code

var checkForMap = function() {
    $scope.post.showMap = true;
    var myLatlng = new google.maps.LatLng($scope.post.location.x, $scope.post.location.y);
    var myOptions = {
        zoom: 15,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var mapHolder = $('.map_class')[$scope.$index];
    $scope.map = new google.maps.Map(mapHolder, myOptions);
    var infowindow = new google.maps.InfoWindow();
    var marker = new google.maps.Marker({
        map: $scope.map,
        position: myLatlng
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent($scope.item.post.post.locationName);
        infowindow.open(map, this);
    });
}
if ($scope.post.locationName != null) {
    checkForMap();
} else {
    $scope.post.showMap = false;
}

using google maps multiple times.By using $scope.$index i can display exact location.

Getting an error at $scope.map = new google.maps.Map(mapHolder, myOptions); — Shiva
– Shiva, Commented Feb 23, 2017 at 5:56
@DeividasKaržinauskas thanks angular.js:14328 TypeError: Cannot read property 'firstChild' of undefined at Object._.Yf (maps.googleapis.com/maps/api/…) at new rg (maps.googleapis.com/maps/api/…) — Shiva
– Shiva, Commented Feb 23, 2017 at 6:15
I've received this error before. The cause in my case was that the google maps script was trying to load before the DOM was fully loaded.. so it tried to append the map to an element that didn't exist yet. — BFG
– BFG, Commented Feb 23, 2017 at 6:55

Vadim Gremyachev · Accepted Answer · 2017-03-01 21:51:44Z

1

Google Maps JavaScript API provides a way to register for event notifications, in particular onload event which triggers once an HTML page is fully loaded.

To ensure map is getting initialized once the page is loaded replace

checkForMap();

with

google.maps.event.addDomListener(window, 'load', checkForMap);

answered Mar 1, 2017 at 21:51

Vadim Gremyachev

59.6k21 gold badges139 silver badges205 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Shiva Over a year ago

Thanks@vadim Gremyachev .It is taking more time(10M) to display map.After the page loading.

Collectives™ on Stack Overflow

getting an error as first child of undefined when using google maps

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related