javascript - 缩小事件的热图权重变化?

标签 javascript google-maps heatmap

这是我的塔林小热图,有 3 个来源:
enter image description here

如您所见,此 map 示例中没有“红色”部分。

但是当我缩小时,我得到了这个:
enter image description here

当您缩小时,我需要我的热图具有橙黄色绿色,而不是红色。
如何使用 Heatmap 和 google-maps-api 实现这一点(可选)。

注:
我做了一个缩小事件来改变半径,我认为这个事件也可以帮助我解决这个问题,但我不知道我应该改变什么配置:

google.maps.event.addListener(map, 'zoom_changed', function() {
    var zoomLevel = map.getZoom();
    heatmap.setOptions({radius:zoomLevel*0.5});
});

最佳答案

我按如下方式解决了这个问题:

function getHeatMapRadius(latitudeCoordinate) {
    var distanceInMeter = 3; /* meter distance in real world */    
    
    var meterPerPixel = 156543.03392 * Math.cos(latitudeCoordinate * Math.PI / 180) / Math.pow(2, zoom);
    var radius = distanceInMeter / meterPerPixel;
  
    return radius;
  }
这里是 source对于上述公式。

关于javascript - 缩小事件的热图权重变化?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30107733/

相关文章:

iphone - 带注释的 map 边界框

c# - 如何使用 C# 从文件中读取内容并将其用于 ASP.NET 页面上的 HTML 代码?

ios - iOS 13 中的 GMSPlacePickerViewController 问题

r - 使用 ggplot2 调整比例热图

google-maps - 如何将HeatMaps添加到Flutter Mobile应用程序

python - 如何在 Python 中结合 Seaborn 中的两个热图,以便两者都显示在同一个热图中?

javascript - Gatsby 似乎需要任何其他框架 10 倍的努力来添加一个图像 : What Am I Not Understanding?

javascript - 使文本响应其是否溢出其父 div

javascript - 手机缝隙的响应式设计支持

javascript - D3.js 树 - 如果没有 child ,检查并设置填充圆节点白色?