Google maps 谷歌地图&x27；s"；仅显示左上角的平铺“；，在Angular js中使用gMaps.js

我检查了google Map的原生API中是否有checkresize（）方法。。但它似乎无法与gmaps.js中的刷新功能配合使用

有没有人在使用AngularJS和gMaps.js时遇到过类似的问题？你是怎么解决的

调整窗口大小后，贴图再次显示。所以我在想，是否有必要检查gMap.js初始化时的大小调整

---

在map元素或directive元素上添加

ng-clope

属性

“NG斗篷指令用于防止浏览器短暂显示角度html模板”

---

ng斗篷在我试用时对我不起作用。我想这是因为我在一个面板中使用地图，它在用户交互时展开，而不是在加载时可见

我把我的ng节目换成了ng if，它工作正常。这是因为映射代码（我使用了a）在if条件为true之前不会运行，这允许它正确渲染

*抱歉，小提琴被删除了。我不记得里面有什么，但它是这样的

---

重要的是，google脚本在您的容器元素实际显示之前不会开始执行它们的操作。这是通过ng if.

贴图在不调整大小的情况下成功渲染完成的

为什么调整大小会给你正确的地图

因为浏览器再次绘制视图

如何修复它

要在最近触发的任何面板中获得地图的正确布局，必须在加载面板后绘制地图。这可以通过（setTimeout）代码实现，如下所述。 代码目标是在60毫秒后触发映射调整大小事件

setTimeout(function () {
        uiGmapIsReady.promise().then(function (maps) {
            google.maps.event.trigger(maps[0].map, 'resize');
            lat = -37;
            lon = 144;
            maps[0].map.panTo(new google.maps.LatLng(lat,lon));
            var marker = {
                id: Date.now(),
                coords: {
                    latitude: lat,
                    longitude: lon
                }
            };
            $scope.map.markers = [];
            $scope.map.markers.push(marker);
            console.log($scope.map.markers);
        });
    }, 60);

---

尝试在控制器中使用以下代码调整贴图大小：

        NgMap.getMap().then(function(map){
            google.maps.event.addListener(map, "idle", function(){
                google.maps.event.trigger(map, 'resize'); 
            });
        });

---

它正在工作，但只是在第一次加载地图时。如果我打开地图，它是确定的，所有的瓷砖显示。但是如果我关闭并打开地图，只会显示左上角的瓷砖。这也帮助了我。我有一个显示隐藏地图的指令。也加快了我的页面速度。这一定是真正的答案，谢谢@Gray你为我节省了很多时间！！JSFIDLE得到了404。你能把重要的部分记在心里吗？@Wirwing我忘了小提琴里有什么。重要的部分不是使用ng show显示/隐藏地图，而是使用ng if。您可能正在使用类似于