google maps with ionic

Question

Im trying to implement a map using google maps with Ionic. I followed the coding in this Link But all i get is a blank screen dont know where i went wrong. Please help

Answer 1

I solved this by setting a in :

and then you will have to do:

.controller('MapCtrl', function($scope, $ionicLoading) {

    google.maps.event.addDomListener(window, 'load', function() {
        var newLatlng = new google.maps.LatLng(53.5000, -113.4300);

        var mapOptions = {
            center: newLatlng,
            zoom: 15,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById("map"), mapOptions);

        navigator.geolocation.getCurrentPosition(function(pos) {
            map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
            var myLocation = new google.maps.Marker({
                position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude),
                map: map,
                title: "My Location"
            });
        });

        $scope.map = map;
    });

});

Reference from: Implement Google Maps Using Ionic Framework