Я хочу отобразить на карте листовки карту тепла.
Я использовал heatmap.js из https://github.com/pa7/heatmap.js, но в итоге он просто отображает
Uncaught TypeError: Невозможно назначить только для чтения свойство 'data' объекта '#'
Так что в конечном итоге я получаю https://github.com/ursudio/leaflet-webgl-heatmap.
// я заметил, что когда я отлаживаю,
метод setData из heatmapLayer имеет это в качестве аргументов
TypeError: свойства 'caller', 'callee' и 'arguments' не могут быть доступны для функций строгого режима или объектов аргументов для их вызова в Function.invokeGetter (: 2: 14)
Ниже мой код
// I initialize heatmap
// first function where i define and create map and the heatmap
var heatmapLayer = new L.webGLHeatmap({
size: 25, // diameter-in-pixels
units: 'px',
opacity: 0.5,
alphaRange: 0.4
});
var myRenderer = L.canvas({ padding: 0.5 });
var markers = L.markerClusterGroup( {
chunkedLoading: true,
renderer: myRenderer,
iconCreateFunction: function (cluster) {
var childCount = cluster.getChildCount();
var c = ' marker-cluster-';
if (childCount < 10) {
c += 'small';
}
else if (childCount < 100) {
c += 'medium';
}
else {
c += 'large';
}
return new L.DivIcon({ html: '<div><span>' + childCount + '</span></div>',
className: 'marker-cluster' + c, iconSize: new L.Point(40, 40)
});
}
});
var overlays = {
"Fancy Markers": markers,
"Fancy Heatmap": heatmapLayer
};
L.control.layers(baseLayer, overlays).addTo(map);
component.set("v.map", map);
component.set('v.markers',markers);
component.set('v.heatLayer',heatmapLayer);
вторая функция
var heatmapLayer = component.get('v.heatLayer');
var locationsAccounts = new Array(accounts.length);
for (var i=0, len = accounts.length; i<len; i++) {
locationsAccounts[i]=[account.ShippingLatitude,
account.ShippingLongitude,1];
}
heatmapLayer.setData(locationsAccounts);