Leaflet.Deflate 和 Leaflet.markercluster 悬停时不显示群集覆盖

Question

当您将鼠标悬停在一个集群上时，Leaflet.markercluster 应该会显示其标记的边界。这是我正在使用的（简化的）代码：

map = new L.Map('map');

L.tileLayer(
  'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    maxZoom: 13,
    attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
  }
).addTo(map);
map.setView([51.505, -0.09], 11);


let deflate_features = L.deflate({
  minSize: 40,
  markerCluster: true
});
deflate_features.addTo(map);

var polygon = L.polygon([
  [51.509, -0.08],
  [51.503, -0.06],
  [51.51, -0.047]
]);
deflate_features.addLayer(polygon);

var polyline = L.polyline([
  [51.52, -0.05],
  [51.53, -0.10],
], {
  color: 'red'
});
deflate_features.addLayer(polyline);

#map {position: absolute; top: 0; bottom: 0; left: 0; right: 0;}

<html>

<head>
  <link href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css" rel="stylesheet" />
  <link href="https://unpkg.com/leaflet.markercluster@1.3.0/dist/MarkerCluster.css" rel="stylesheet" />
  <link href="https://unpkg.com/leaflet.markercluster@1.3.0/dist/MarkerCluster.Default.css" rel="stylesheet" />

  <script src="https://unpkg.com/leaflet@1.3.3/dist/leaflet.js"></script>
  <script src="https://unpkg.com/leaflet.markercluster@1.3.0/dist/leaflet.markercluster.js"></script>
  <script src="https://unpkg.com/Leaflet.Deflate@1.0.0-alpha.2/dist/L.Deflate.js"></script>

</head>

<body>
  <div id="map"></div>
</body>

</html>

为什么鼠标悬停时集群覆盖范围不显示？

Answer 1

如果只有 2 个对象，则不会显示覆盖范围...:|

添加第三个对象，例如：

var polyline2 = L.polyline([
  [51.535, -0.1],
  [51.525, -0.05],
], {
  color: 'green'
});
deflate_features.addLayer(polyline2);

启用集群覆盖：

Leaflet.Deflate 和 Leaflet.markercluster 悬停时不显示群集覆盖

Leaflet.Deflate with Leaflet.markercluster does not show cluster coverage on hover

leaflet

leaflet.markercluster

leaflet.deflate