更改热图上单个点的半径？

Posted 2023-02-23

【中文标题】更改热图上单个点的半径？

【英文标题】：Change radius for a single point on Heatmap?

【发布时间】：2015-07-19 03:29:21

【问题描述】：

这是在 Google Maps Api 中创建热图图层的方法：

var data = [
        location: new google.maps.LatLng(59.4072, 24.7053),weight:0.8,
        location: new google.maps.LatLng(59.4372, 24.7473),weight: 1,
        location: new google.maps.LatLng(59.4372, 24.7493),weight:0.8,
        location: new google.maps.LatLng(59.483428, 24.841709),weight: 0.6,
        location: new google.maps.LatLng(59.483256, 24.846666),weight: 0.2,
        location: new google.maps.LatLng(59.409425, 27.278345),weight: 0.3
    ];

heatmap = new google.maps.visualization.HeatmapLayer(
    data: data,
    radius: 10
);

如您所见，您必须在 Heatmap 配置中指定半径。但是如何为 Heatmap 上的单个源（点）指定不同的半径？

【问题讨论】：

你可以制作不同的“数据”数组并分配不同的半径吗？

那行不通，因为最初它希望 radius 在热图配置中

【参考方案1】：

理论上你可以制作多个热图图层 https://github.com/pa7/heatmap.js/issues/96#issuecomment-272202758

var data1 = [
    location: new google.maps.LatLng(59.4072, 24.7053),weight:0.8,
    location: new google.maps.LatLng(59.4372, 24.7473),weight: 1,
    location: new google.maps.LatLng(59.4372, 24.7493),weight:0.8,
    location: new google.maps.LatLng(59.483428, 24.841709),weight: 0.6,
    location: new google.maps.LatLng(59.483256, 24.846666),weight: 0.2,
    location: new google.maps.LatLng(59.409425, 27.278345),weight: 0.3
];

heatmap1 = 新的 google.maps.visualization.HeatmapLayer1( 数据：数据1， 半径：10 );

var data2 = [
    location: new google.maps.LatLng(59.4072, 24.7053),weight:0.8,
    location: new google.maps.LatLng(59.4372, 24.7473),weight: 1,
    location: new google.maps.LatLng(59.4372, 24.7493),weight:0.8,
    location: new google.maps.LatLng(59.483428, 24.841709),weight: 0.6,
    location: new google.maps.LatLng(59.483256, 24.846666),weight: 0.2,
    location: new google.maps.LatLng(59.409425, 27.278345),weight: 0.3
];

heatmap2 = 新的 google.maps.visualization.HeatmapLayer2( 数据：数据2， 半径：3 );

【讨论】：

我想问题是改变每个点的半径，而不仅仅是为此创建大量地图......

【参考方案2】：

好吧，你可以从配置中删除半径！

例子：

var heatMapData = [
  location: new google.maps.LatLng(37.782, -122.447), weight: 0.5,
  location: new google.maps.LatLng(37.782, -122.443), weight: 2
];

heatmap = new google.maps.visualization.HeatmapLayer(
    data: heatMapData
);

您可以找到如何自定义热图图层> here