heatmap.js icon indicating copy to clipboard operation
heatmap.js copied to clipboard

configure radius change does't work

Open FunctionRun opened this issue 8 years ago • 7 comments

When I use heatmapInstance configure method to change radius ,for example: var newConfig = { radius: Math.random() * 20 } heatmapInstance.configure(nuConfig);

that does't work . I see the code and find radius changed but store._radi not change

FunctionRun avatar Mar 25 '16 07:03 FunctionRun

i have the same question too, is there a good solution?

smalltwo avatar Mar 25 '16 07:03 smalltwo

You can't change the radius by the method .configure() but you can do it by using.setData(). For example:

var dataPoint = {
     x: 50,
     y: 50,
     value: 20,
     radius: 50
};

var data = {
   max: 100,
   min: 0,
   data: [dataPoint]
};

heatmapInstance.setData(data)

Then you can change the radius.

Molunerfinn avatar Apr 08 '16 11:04 Molunerfinn

The google heatmap plugin doesn't know the method configure(). Therefore I cannot resize radius. How can I remove from map? (to readd)

AppWerft avatar Nov 13 '16 14:11 AppWerft

Meet the same problem. I add a function to "Store.prototype", like this:

 ,resetRadius: function(radius){
   if (radius) {
     this._cfgRadius = radius;
     var radi = this._radi;
     for(var x in radi){
       for(var y in radi[x]){
         radi[x][y] = radius;
       }
     }
   } // end if
 }
and it will be used in "Heatmap.configure" function. like this:
configure: function(config) {
    this._config = Util.merge(this._config, config);
    this._renderer.updateConfig(this._config);
    this._store.resetRadius(config["radius"]); // reset radius
    this._coordinator.emit('renderall', this._store._getInternalData());
    return this;
},
Hope it helps :)

ghost avatar Dec 01 '16 10:12 ghost

@quietsnowyday It's very good!

ParadeTo avatar Jun 01 '17 07:06 ParadeTo

Just wanted to second @quietsnowyday's solution here for updating the radius from configure - works really well, thank you!

If you're having a similar problem with the blur not being updated, I found the easiest solution was:

        var tpl;
        if (!this._templates[radius + "_" + blur]) {
          this._templates[radius + "_" + blur] = tpl = _getPointTemplate(radius, blur);
        } else {
          tpl = this._templates[radius + "_" + blur];
        }

(inside the _drawAlpha function; essentially it's caching the template based only on the radius, not on the blur as well). There's a pull request for something similar from someone else too but I thought it'd be handy to have the two in the same place in this issue in case anyone else, like me, is trying to generate dynamically reconfigurable heatmaps.

benshimmin avatar Sep 13 '18 09:09 benshimmin

Just wanted to second @quietsnowyday's solution here for updating the radius from configure - works really well, thank you!

If you're having a similar problem with the blur not being updated, I found the easiest solution was:

        var tpl;
        if (!this._templates[radius + "_" + blur]) {
          this._templates[radius + "_" + blur] = tpl = _getPointTemplate(radius, blur);
        } else {
          tpl = this._templates[radius + "_" + blur];
        }

(inside the _drawAlpha function; essentially it's caching the template based only on the radius, not on the blur as well). There's a pull request for something similar from someone else too but I thought it'd be handy to have the two in the same place in this issue in case anyone else, like me, is trying to generate dynamically reconfigurable heatmaps.

Thanks -- hours of searching, writing on the git page, nothing helped until I saw this. Updating the blur (radius, opacity were ok) change was a headache and this was the Tylenol !

DrPDash avatar Jul 22 '20 06:07 DrPDash