【问题标题】: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 在热图配置中

标签: javascript google-maps google-maps-api-3 maps heatmap


【解决方案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

【讨论】:

    猜你喜欢
    • 2014-10-29
    • 1970-01-01
    • 2012-11-21
    • 2016-12-23
    • 1970-01-01
    • 2016-06-24
    • 1970-01-01
    • 2019-07-20
    • 1970-01-01
    相关资源
    最近更新 更多