Mic*_*ael 5 javascript maps google-maps heatmap google-maps-api-3
以下是在 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
});
Run Code Online (Sandbox Code Playgroud)
如您所见,您必须在热图配置中指定半径。
但是如何为热图上的单个源(点)指定不同的半径?
小智 0
理论上你可以制作多个热图层 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}
];
Run Code Online (Sandbox Code Playgroud)
heatmap1 = new google.maps.visualization.HeatmapLayer1({ 数据: data1, 半径: 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}
];
Run Code Online (Sandbox Code Playgroud)
heatmap2 = new google.maps.visualization.HeatmapLayer2({ 数据: data2, 半径: 3 });
| 归档时间: |
|
| 查看次数: |
1651 次 |
| 最近记录: |