谷歌地图指令调整大小事件投掷

时间:2015-05-08 12:21:16

标签: javascript angularjs google-maps

当我显示/隐藏谷歌地图时,它只显示在左上角的一个小方框中。我已经看了其他解决方案,他们说要放一个

var resultFromRegex = "2015/03/27";
DateTime validDate;
var isValid = DateTime.TryParseExact(resultFromRegex, "yyyy/MM/dd", new System.Globalization.CultureInfo("en-US"), System.Globalization.DateTimeStyles.None, out validDate);

在我的地图上运行,所以当我显示它时,会调整resize事件。

当我加载网页时,我收到以下错误:

        google.maps.event.addListenerOnce(map, "idle", function() {
            google.maps.event.trigger(map, "resize");
        });

我的指令如下:

TypeError: Cannot read property '__e3_' of undefined
    at $e (https://maps.gstatic.com/maps-api-v3/api/js/20/10/main.js:17:1614)
    at new Ye (https://maps.gstatic.com/maps-api-v3/api/js/20/10/main.js:20:321)
    at Object.S.addListener (https://maps.gstatic.com/maps-api-v3/api/js/20/10/main.js:17:1332)
    at Object.S.addListenerOnce (https://maps.gstatic.com/maps-api-v3/api/js/20/10/main.js:19:321)
    at linkFunction (http://localhost:3000/ffprototype.js?30b6906416281b1680ca5206c9cc5612b1a78d83:47:23)
    at invokeLinkFn (http://localhost:3000/packages/angular_angular.js?9db7e8edebe9ba02ab378f03d9a52d49148583ee:8288:9)
    at nodeLinkFn (http://localhost:3000/packages/angular_angular.js?9db7e8edebe9ba02ab378f03d9a52d49148583ee:7798:11)
    at compositeLinkFn (http://localhost:3000/packages/angular_angular.js?9db7e8edebe9ba02ab378f03d9a52d49148583ee:7147:13)
    at nodeLinkFn (http://localhost:3000/packages/angular_angular.js?9db7e8edebe9ba02ab378f03d9a52d49148583ee:7793:24)
    at compositeLinkFn (http://localhost:3000/packages/angular_angular.js?9db7e8edebe9ba02ab378f03d9a52d49148583ee:7147:13)

我也试过在链接功能中移动事件监听器,但这也没有用。

1 个答案:

答案 0 :(得分:0)

在您定义它之前,您似乎正在尝试使用map。地理编码器不会立即发生,因此当您addListenerOnce点火时,map尚未定义。

您可以像这样重新组织:

app.directive('addressBasedGoogleMap', function() {
    var map
    var linkFunction = function(scope, element, attrs) {
        var googleAddress = scope.$eval(attrs.address);
        var geocoder = new google.maps.Geocoder(); 
        geocoder.geocode({ 'address': googleAddress}, function (results, status){ 
            if (status == google.maps.GeocoderStatus.OK) { 
                var mapOptions = { zoom: 16, center:results[0].geometry.location, mapTypeId:google.maps.MapTypeId.ROADMAP}
                map = new google.maps.Map(element[0], mapOptions); 
                var marker1 = new google.maps.Marker({
                   position: results[0].geometry.location,
                   map: map,
                   title: googleAddress
                });
                google.maps.event.addListenerOnce(map, "idle", function() {
                    google.maps.event.trigger(map, "resize");
                });
            } else {
                alert(status)
            }
        })
    };
    google.maps.event.addDomListener(window, "resize", function() {
        var center = map.getCenter();
        google.maps.event.trigger(map, "resize");
        map.setCenter(center);
    });
    return {
        link: linkFunction
    };
});

这样,一旦您知道在地理编码器返回后正确定义了地图,您就会设置侦听器。