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

【问题标题】：Canvas not redrawn unless zoom is changed with leaflet and heatmap.js除非使用传单和 heatmap.js 更改缩放，否则不会重绘画布
【发布时间】：2013-06-28 09:15:27
【问题描述】：

我在使用heatmap.js 插件的应用程序中有一个奇怪的错误，我不确定问题出在我的代码、leaflet 还是插件中。

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

这里有一些图片可以理解发生了什么：

第 1 步： 点击按钮绘制巴黎周边的热图：

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

第 2 步：点击一个按钮在东部绘制热图：结果：添加了第二张热图，但并未删除 paris 周围的热图。（错误）

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

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

 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();
   }

我的问题

对于如何定位问题的任何建议，我将不胜感激。有污点就更好了。

【问题讨论】：

标签： javascript canvas leaflet heatmap

【解决方案1】：

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

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

【讨论】：