Big radius will cause drawing problems

[mariusheil]

Hi,

I guess this must be known but I am not sure what to do to fix this. When you increase the radius to 200 for example, you'll get drawing problems where quarter circles are added above each heatmap point.
I've noticed that increasing the shadowOffsetX and Y and the values in the arc function below would alleviate the problem with bigger radiuses. Does this affect performance? If not, we could just choose a much higher value and if it does, we could make it proportional to the radius so that it only increases if really needed.

[mourner]

Interesting, I'll look into it when I have a free minute.

[lord26mt]

I've also noticed this issue when i set the radius bound to the canvas size.
above 100px it seems to do strange things.
I've made a simple JSFiddle to show the problem. https://jsfiddle.net/fqxcqrap/3/
@mariusheil : can you please share your soluion of the problem?

[mariusheil]

Hi, solution was just as I was saying. I am on holidays right now, so I can't produce a patch, but here's what I did:

    ctx.shadowOffsetX = ctx.shadowOffsetY = 200;
    ctx.shadowBlur = blur;
    ctx.shadowColor = 'black';

    ctx.beginPath();
    ctx.arc(r2 - 200, r2 - 200, r, 0, Math.PI * 2, true);

I've just changed the three occurences of the number 200 to 600 which corresponds to a bigger shadow offset and that worked for me.