サイト訪問者を表示するために、Meteor とリーフレットを使用してリアクティブ マップを作成しようとしています。マップの応答が遅くなり、すぐに機能しなくなるまで、すべてが正常に機能します (ブラウザーを開いたままにして約 30 分)。
新しいマーカーを追加する前にマーカーをクリアし、マップをできるだけきれいに保ちましたが、成功しませんでした。私のコードは次のとおりです。
オンdocument.ready
:
visitors_map = new L.Map('visitors-map').setView([24, 17], 3);
markers = new L.MarkerClusterGroup();
L.Icon.Default.imagePath = 'packages/leaflet/images';
L.tileLayer('http://{s}.tile.cloudmade.com/api_key/26250/256/{z}/{x}/{y}.png').addTo(visitors_map);
Session.set("visitors_map_rendered", true);
オンDeps.autorun
:
if (Session.get("visitors_map_rendered")) {
visitors_map.removeLayer(markers);
var markerList = [];
var visitors = Visitors.find();
visitors.forEach(function(visitor) {
markerList.push(L.marker([visitor.geo.latitude, visitor.geo.longitude]));
});
markers.clearLayers();
markers.addLayers(markerList);
visitors_map.addLayer(markers);
visitors_map.fitBounds(markers.getBounds().pad(0.3));
}
誰かが私のコードで何か悪いことを見ていますか? クリアするのを忘れて、ブラウザーの速度が「加算」されているものはありますか?