You need to sign in to do that
Don't have an account?

How can i resolve this MarkerCluster checkin/ checkout error (leaflet) ?
I have this code:
JS controller:
var map = L.map('map', {zoomControl: true, tap: false, preferCanvas:true})
var group1,group2,group3,group4;
var myRenderer = L.canvas({ padding: 0.5 });
var markers = L.markerClusterGroup.layerSupport( {
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) });
}
});
group1 = L.layerGroup(),
group2 = L.layerGroup(),
group3 = L.layerGroup(),
group4 = L.layerGroup(),
markers.checkIn([group1, group2, group3, group4]);
var overlayMaps = {
"g1": group1,
"g2": group2,
"g3":group3,
"g4":group4
};
var control = L.control.layers(null, overlayMaps, { collapsed: true });
/*control.addOverlay(group1, 'g1');
control.addOverlay(group3, 'g3');
control.addOverlay(group2, 'g2);
control.addOverlay(group4, 'g4'); */
//controlMarkers = L.control.layers(markers, null, { collapsed: true });
//controlHeatMap = L.control.layers(heatmapLayer, null, { collapsed: true });
control.addTo(map);
group1.addTo(map); // Adding to map or to AutoMCG are now equivalent.
group2.addTo(map);
group3.addTo(map);
group4.addTo(map);
markers.addTo(map);
The prolem is that when i check out on overlay and after i check in again i receive this error:
Uncaught TypeError: Cannot read property 'x' of undefined
throws at dist/leaflet.markercluster.js:1:25696 TypeError: Cannot read property 'x' of undefined
at L.DistanceGrid._sqDist (DistanceGrid.js:114)
at L.DistanceGrid.getNearObject (DistanceGrid.js:94)
at e._addLayer (MarkerClusterGroup.js:974)
at eval (MarkerClusterGroup.js:249)
at e.addLayers (MarkerClusterGroup.js:283)
at e.addLayers (layersupport.js:99)
at e.onAdd (layersupport.js:517)
at e._layerAdd (leaflet.js:5)
at e.whenReady (leaflet.js:5)
at e.addLayer (leaflet.js:5)
I saw that this function is called from DistanceGrid
_sqDist: function (p, p2) {
var dx = p2.x - p.x,
dy = p2.y - p.y;
return dx * dx + dy * dy;
}
And when i checked in is p is somehow undefined. Im struggling with this error for a long period already. Maybe you have some suggestion
libraries that are imported
/resource/leaflet/leaflet.js,
/resource/leafletMarkerCluster/Leaflet.markercluster-1.4.1/dist/leaflet.markercluster.js, /resource/LeafletFilterCluster/Leaflet.MarkerCluster.LayerSupport-master/src/layersupport.js
JS controller:
var map = L.map('map', {zoomControl: true, tap: false, preferCanvas:true})
var group1,group2,group3,group4;
var myRenderer = L.canvas({ padding: 0.5 });
var markers = L.markerClusterGroup.layerSupport( {
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) });
}
});
group1 = L.layerGroup(),
group2 = L.layerGroup(),
group3 = L.layerGroup(),
group4 = L.layerGroup(),
markers.checkIn([group1, group2, group3, group4]);
var overlayMaps = {
"g1": group1,
"g2": group2,
"g3":group3,
"g4":group4
};
var control = L.control.layers(null, overlayMaps, { collapsed: true });
/*control.addOverlay(group1, 'g1');
control.addOverlay(group3, 'g3');
control.addOverlay(group2, 'g2);
control.addOverlay(group4, 'g4'); */
//controlMarkers = L.control.layers(markers, null, { collapsed: true });
//controlHeatMap = L.control.layers(heatmapLayer, null, { collapsed: true });
control.addTo(map);
group1.addTo(map); // Adding to map or to AutoMCG are now equivalent.
group2.addTo(map);
group3.addTo(map);
group4.addTo(map);
markers.addTo(map);
The prolem is that when i check out on overlay and after i check in again i receive this error:
Uncaught TypeError: Cannot read property 'x' of undefined
throws at dist/leaflet.markercluster.js:1:25696 TypeError: Cannot read property 'x' of undefined
at L.DistanceGrid._sqDist (DistanceGrid.js:114)
at L.DistanceGrid.getNearObject (DistanceGrid.js:94)
at e._addLayer (MarkerClusterGroup.js:974)
at eval (MarkerClusterGroup.js:249)
at e.addLayers (MarkerClusterGroup.js:283)
at e.addLayers (layersupport.js:99)
at e.onAdd (layersupport.js:517)
at e._layerAdd (leaflet.js:5)
at e.whenReady (leaflet.js:5)
at e.addLayer (leaflet.js:5)
I saw that this function is called from DistanceGrid
_sqDist: function (p, p2) {
var dx = p2.x - p.x,
dy = p2.y - p.y;
return dx * dx + dy * dy;
}
And when i checked in is p is somehow undefined. Im struggling with this error for a long period already. Maybe you have some suggestion
libraries that are imported
/resource/leaflet/leaflet.js,
/resource/leafletMarkerCluster/Leaflet.markercluster-1.4.1/dist/leaflet.markercluster.js, /resource/LeafletFilterCluster/Leaflet.MarkerCluster.LayerSupport-master/src/layersupport.js