Google Maps JS v3 - 分离的DOM树 - 内存泄漏?

ric*_*uck 26 javascript dom google-maps memory-leaks google-maps-api-3

我有以下问题.我setMap(null)通过以下代码删除所有对谷歌地图实例的引用,包括标记:

destroyMaps = function () {
    leftMap = null;
    window.map = null;
    geocoder = null;
    for (var i=0; i<window.rightMarkers.length; i++) {
        window.rightMarkers[i].setMap(null);
        window.rightMarkers[i] = null;
    }
    window.rightMarkers = null;
    $("#map-canvas-right").remove();

    for (var i=0; i<window.leftMarkers.length; i++) {
        window.leftMarkers[i].setMap(null);
        window.leftMarkers[i] = null;
    }
    window.leftMarkers = null;
    $("#map-canvas-left").remove();

}
Run Code Online (Sandbox Code Playgroud)

引用leftMapwindow.map在我的整个代码中唯一的东西是:

对于 window.map

var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: window.map,
                    icon: window.pins[keyword_category.category_name],
                    shadow: window.pins["Shadow"],

                    title:job.job_title
});
marker.job_type =  keyword_category.category_name;
window.rightMarkers.push(marker);
Run Code Online (Sandbox Code Playgroud)

对于 leftMap

var marker = new google.maps.Marker({
                position: myLatlng,
                map: leftMap,
                icon: window.pins[keyword_category.category_name],
                shadow: window.pins["Shadow"],

                title:job.job_title
 });
 window.leftMarkers.push(marker);
Run Code Online (Sandbox Code Playgroud)

但是在我的分离DOM树中,在创建地图之前进行比较时/在它们被销毁之后进行比较时,仍然是谷歌地图图块:

在此输入图像描述

(右键单击 - 打开图像查看完整尺寸)

我该怎么做才能找出导致这个DOM泄漏的原因?

TMS*_*TMS 30

这是Google Maps API v3中的一个已知问题 - 即使纯google.maps对象的创建和销毁(无标记创建)也会导致内存泄漏.参见问题3803:错误:破坏谷歌地图实例决不释放内存.

他们通过创建一个创建和销毁对象的简单循环来重现问题google.maps.看到

http://jsfiddle.net/KWf4r/

按下开始后,您将观察到浏览器在内存中增长,直到您按下停止.

问题没有解决,似乎没有正式的解决方法.肯定有一种方法,但这并不是一个干净的解决方法,显然可能会停止在下一版谷歌地图中停止工作 - 引用讨论:

我实际上通过手动摧毁谷歌地图创建的许多元素(以及删除侦听器)来设法找到一个半可行的修复程序.但是,我正在使用大量未记录的内容来执行此操作(我必须检查chrome检查器以查看要尝试删除的内容),因此这似乎不是正确的方法.

  • 重用相同的地图实例对我有用.我通过抓取元素来实现这一点:`window.$ leftMap = $(".leftMap");`在jQuery中,并通过将它附加到父元素时重用它:`$("#map-canvas .-left")追加(窗口$ leftMap);` (2认同)