javascript Google Maps JS v3 - 分离的 DOM 树 - 内存泄漏?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/21142483/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Maps JS v3 - detached DOM tree - memory leak?
提问by rickyduck
I have the following issue. I am removing all references to a google maps instance including markers via the setMap(null)
option via the following code:
我有以下问题。我正在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();
}
The only things that reference leftMap
or window.map
in my whole code is:
唯一引用leftMap
或window.map
在我的整个代码中的内容是:
For window.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);
For leftMap
为了 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);
However in my detached DOM tree, when comparing before the maps were created / after they were destroyed, remains the google maps tiles:
然而,在我分离的 DOM 树中,在地图创建之前/地图被销毁之后进行比较时,仍然是谷歌地图图块:
(Right click - open image to see full size)
(右键单击 - 打开图像查看完整尺寸)
What can I do to find out what's causing this DOM leak?
我该怎么做才能找出导致此 DOM 泄漏的原因?
回答by TMS
This is a known issue in Google Maps API v3 - even pure creation and destruction of google.maps
object (no marker creation) results in memory leak. See Issue 3803: Bug: Destroying Google Map Instance Never Frees Memory.
这是 Google Maps API v3 中的一个已知问题 - 即使是纯粹的google.maps
对象创建和销毁(不创建标记)也会导致内存泄漏。请参阅问题 3803:错误:销毁 Google 地图实例永远不会释放内存。
They reproduce the issueby creating a simple loop that creates and destroys the google.maps
object. See
他们通过创建一个创建和销毁对象的简单循环来重现该问题google.maps
。看
After pressing start, you will observe your browser to grow in memory until you press stop.
按开始后,您将观察浏览器在内存中的增长,直到您按停止。
The issue is not fixed and there doesn't seem to be an official workaround available. There is certainly a way, but it's not a clean workaround that apparently might stop working in next release of google maps api - citing the discussion:
该问题未解决,似乎没有可用的官方解决方法。当然有一种方法,但它不是一个干净的解决方法,显然可能会在谷歌地图 api 的下一个版本中停止工作 - 引用讨论:
I've actually managed to find a semi-workable fix by manually destroying a lot of the elements that google maps creates (and removing listeners). However, I am using a lot of undocumented things to do this (I had to check in the chrome inspector to see what to try to remove), so this doesn't seem the right way to go.
通过手动销毁谷歌地图创建的许多元素(并删除侦听器),我实际上设法找到了一个半可行的修复方法。但是,我使用了很多未记录的内容来执行此操作(我必须检查 chrome 检查器以查看要尝试删除的内容),因此这似乎不是正确的方法。