Javascript Google maps Inner colorbox在ajax调用后渲染偏好灰色区域

我使用GoogleMapsAPIv3使用ajax调用在colorbox中呈现GoogleMap

这是我用作map和其他一些东西的容器的div，它将显示在colorbox中，也将调用witch click上的锚定ajax：

<div id="cb-js-map-content" style="display: none"></div>
<a href="#cb-js-map-content" id="cb-js-showMap">
   Show Map
</a>

这是将加载地图的div

<div class="inlineClass" id="cb-js-mainMap" style="width:1023px; height: 800px; display:block"></div>

现在我的问题是，这种设置几乎总是在firefox上起作用，而在Chrome上却很少起作用。这就是问题屏幕的外观：

---

关闭colorbox弹出窗口有时可以解决此问题。

在

$的成功回调中触发resize事件。ajax（）

在触发resize之前使用短延迟。我找到了ajax调用的长度（以毫秒为单位），并将其放入setTimeOut，现在可以工作了。但当地图调整大小时仍然会有小闪烁，还有其他方法吗。无论如何，谢谢你的提示。。。

<div class="inlineClass" id="cb-js-mainMap" style="width:1023px; height: 800px; display:block"></div>

initializeMap = function () {
                var mapOptions = {
                    center: centerLatlng,
                    zoom: 8,
                    minZoom: 10,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    scrollwheel: false
                };
                map = new google.maps.Map(document.getElementById("cb-js-mainMap"), mapOptions);

                //Add event for zoom changed and store data for map center
                google.maps.event.addListener(map, 'zoom_changed', function () {
                   //listener code
                });
                google.maps.event.trigger(map, 'resize');

            }