从谷歌地图中删除HeatmapLayer

Question

我正在使用HeatmapLayer api https://developers.google.com/maps/documentation/javascript/layers#JSHeatMaps

我像这样生成热图:

heatmap = new google.maps.visualization.HeatmapLayer({
    data: heatmapData,
    radius: 50
});
heatmap.setMap(google_map);

当我想使用与上面相同的功能显示另一个热图时(我正在使用ajax并且我有新标记要显示,所以我也需要更改热图)热图图层保留在地图上,在这种情况下我在我的地图上有2个重叠的热图.我怎样才能首先删除当前的热门播放器？

这是我的演示代码,如果你点击地图下方的链接,会添加热图,再次点击它,它应该删除它,但它只是一遍又一遍地重复:

http://jsfiddle.net/LpL3P/

Answer 1

文档建议您可以通过调用删除图层 heatmap.setMap(null)

更新

在你的jsfiddle中,你heatmap在每个click事件的范围内声明了你的变量.为了使您的代码工作,我将heatmap变量全局移动,然后检查以确保新的heatmap不会覆盖现有的变量.

这是你更新的jsfiddle

Answer 2

对于在原始帖子发布数年后寻找解决方案的其他人，我发现以下方法有效。首先将变量声明为将保存热图 MVCObject 的全局变量。

var mvcObj;

然后，在您用来添加热图的函数中

if( typeof( mvcObj )=='object' ) mvcObj.clear();
/* locations is an array of latlngs */
mvcObj = new google.maps.MVCArray( locations );

/* this.map is a reference to the map object */
var heatmap = new google.maps.visualization.HeatmapLayer({
    data: mvcObj,
    map: this.map
});