除非使用leaflet和heatmap.js更改缩放，否则不会重绘画布

Question

我的应用中使用heatmap.js插件时出现了一个奇怪的错误，我不确定问题出在我的代码，leaflet或插件中。

我正在动态创建新的热图。所以我想删除旧的并追踪一个新的，这应该是heatmpa.js的默认行为。令人惊讶的是，在我缩小或缩小之前，它不会删除旧的。

以下是一些了解发生情况的图片：

第1步：点击按钮在巴黎周围绘制热图：

结果：正如预期的那样，巴黎周围的热图。

第2步：点击按钮在东部绘制热图： 结果：添加了第二个热图，但不会删除巴黎周围的热图。 （错误）

第3步：点击加号图标可放大地图 结果：按预期缩放，巴黎周围的热图消失。

这是setData函数heatmap-leaflet的代码，它替换数据并调用重绘：

 setData: function ( dataset )
 {
    var self = this;
    var latLngs = [];
    this._maxValue = 0;
    dataset.forEach( function ( d )
    {
        latLngs.push( new L.LatLng( d.lat, d.lon ) );
        self._maxValue = Math.max( self._maxValue, d.value );
    } );
    this._bounds = new L.LatLngBounds( latLngs );

    this._quad = new QuadTree( this._boundsToQuery( this._bounds ), false, 6, 6 );

    dataset.forEach( function ( d )
    {
        self._quad.insert( {
            x: d.lon,
            y: d.lat,
            value: d.value
        } );
    } );

    this.redraw();
   }

我的问题

我很感激有关如何找到问题的任何建议。土壤污染会更好。

Answer 1

问题是插件的作者需要重置切片图层然后更新它。我不清楚为什么redraw函数没有在Leaflet中这样做，并怀疑它可能是Leaflet中的一个错误。我能够复制您的问题，现在您可以做的是让它自己重置并更新图层。设置新数据后，请执行以下操作：

heatmapLayer.setData(Your data);
heatmapLayer._reset();
heatmapLayer._update();