Jquery google maps api v3带有“Qf[F]未定义”错误和后续灰色/非中心

我整晚都在胡闹，无法解决这个问题。我正在将GoogleMapsAPIv3加载到Boostrap3Ajax模式中。单击.dtMap，我将模态页面加载到模态分区。。。打开/显示它。。。然后用google loader加载地图选项

第一次单击时，所有内容都正确显示，但我在控制台中收到一个“TypeError:Qf[F]未定义”错误

关闭模式并再次打开后，上述错误消失，但贴图仅显示在其“窗口”的左上角。地图的其余部分是浅灰色的。我已经找到了一些解决这个灰色问题的“解决方案”，例如，但似乎无法让它与我的实现一起工作

我可以为第二部分确认，如果我调整浏览器大小，贴图将被更正，但不再居中

因此，任何对这两方面的帮助都将不胜感激

JS素材：

编辑部分解决方案：

当我的模态打开时，我将其设置为400衰减。我现在将地图的加载延迟了400秒，这样地图在加载时就不会消失。这解决了定心和灰色区域

在第一次模式打开/映射打开时，我仍然收到“TypeError:Qf[F]未定义”错误。如果在此初始时间之后关闭模式并再次打开任意次数，错误将不再出现。有人能更清楚地说明这个错误是什么吗？不过，就操作/外观而言，它似乎不会影响任何东西

// show google map
$('#datatable').on('click', '.dtMap', function () {

    var data = {
      'activity_id': $(this).parents('tr').attr('id')
    };

    $('#modal-ajax').load('/modals/m_view_map.php', data,
        function() {
            $(this).modal('show');
            // wait till modal opens (400)
            setTimeout(function (){

                google.load('maps','3', {other_params:'sensor=false', callback: function(){

                    latLng = new google.maps.LatLng(29.4889, -98.3987);

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

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

                    var marker = new google.maps.Marker({
                        position: latLng,
                        map: map,
                        title: 'test'
                    });

                }});    

            }, 400);
      });
});

---

可能重复的外观和尝试的解决方案和什么是不同的-仍然不起作用。你的模式有一个大小？一旦显示，您是否会触发调整大小事件？我一直在尝试触发调整大小，并根据我找到的所有解决方案将其居中，但似乎无法使其工作。在第一次单击时显示精细减去Qf错误，然后所有显示都不以灰色区域居中。如果我调整浏览器的大小，灰色会消失，但是它仍然不居中。此外，当modal/map.map_画布的初始打开设置为高度：250px后，Qf错误消失；宽度：100%。该站点与模式一样具有响应性。

// show google map
$('#datatable').on('click', '.dtMap', function () {

    var data = {
      'activity_id': $(this).parents('tr').attr('id')
    };

    $('#modal-ajax').load('/modals/m_view_map.php', data,
        function() {
            $(this).modal('show');
            // wait till modal opens (400)
            setTimeout(function (){

                google.load('maps','3', {other_params:'sensor=false', callback: function(){

                    latLng = new google.maps.LatLng(29.4889, -98.3987);

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

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

                    var marker = new google.maps.Marker({
                        position: latLng,
                        map: map,
                        title: 'test'
                    });

                }});    

            }, 400);
      });
});