Javascript 在放大和缩小时，如何避免画布元素中圆形标记不必要的填充不透明度更改？

我遇到填充不透明度设置的一些奇怪行为。这发生在圆和半圆标记上。FillOpacity未显式设置，正在使用默认值

我的场景描述如下（简化版可以在

我有超过100k个半圆，它们是在画布元素中定义的，用于更快的渲染

对于大于10的每个缩放级别，将定义不同的半径，以便有一个可读的地图。缩放越高，半径越小。触发“zoomend”事件后，将定义当前缩放，并将相应的半径设置为具有以下内容的圆：

layerSites1.eachLayer(function(layer) {
    return layer.setRadius(rad1); 
});

放大（通常是最大值）后，当我开始缩小fillOpacity的密度时，它会变暗。这一点可以通过贴图的最小移动来解决。有时整个圆的fillOpacity变暗，有时只是其中的一部分。下面可以找到这两种情况的示例：

可以测试上面提到的JS Bin示例-红色圆圈上的fillOpacity变化更为明显。您需要完全放大然后缩小，以便观察效果。如果第一次没有出现这种情况，请再次尝试放大然后缩小

如果有人建议我做错了什么，或者是浏览器渲染问题，或者是其他问题，我将不胜感激。我用Chrome、Chrome、IE和Firefox进行了测试

---

谢谢！

在

zoomend

事件和画布的实际重画之间似乎存在时间问题。也许这是一个值得讨论的问题，但同时，让和仅在设置半径时使用此选项似乎可以解决问题：

setTimeout(function() {
    layerSites1.eachLayer(function(layer) {
        return layer.setRadius(rad1);
    });
}, 0);

---

这里有一个更新的

你的解决方案在我的10万个以上标记的大地图上也起到了作用：）事实上，我很绝望，删除了标记的填充，但现在我可以回到我原来的想法，多亏了你。我将在GitHub上报告这一点。非常感谢，Nikosh！你好，nikoshr。正如你所建议的，我在Github上打开了一个问题。还有一件事，这里也有描述。正如我确认的那样，在放大和缩小时，您的工作环境非常好。但新的问题是，无论何时移动贴图（而不是缩放），扭曲的填充不透明度都会重新绘制。