TypeScript - הוספת מחלקת CSS לשכבת Leaflet בזמן ריצה

אני משתמש ב-Leaflet כדי לצייר שכבות של עיגולים (כך שיש כמה שכבות, כל אחת מהן מורכבת ממספר עיגולים) על מפה.

שמתי את כל השכבות בקבוצת מאפיינים:

this.globalLayer = L.featureGroup();

אני מוסיף מעגלים חדשים לזה על ידי יצירת קבוצת תכונות חדשה של המעגלים, והוספת קבוצת התכונות ל-globalLayer:

let circleLayer: L.featureGroup();

let point1 = L.circle([pos_lat, pos_long], {color: color, opacity: 1, 
radius: radius});
let point2 = L.circle([pos_lat, pos_long], {color: color, opacity: 1, 
radius: radius});
circleLayer.addLayer(point1);
circleLayer.addLayer(point2);
// etc.

this.globalLayer.addLayer(circleLayer);

עכשיו אני רוצה להוסיף מחלקת CSS לכמה מהשכבות:

for (let cssLayer of cssLayers) { // cssLayers is a L.featureGroup[]
    this.globalLayer.removeLayer(cssLayer);
    cssLayer.setStyle({className: 'animate'});
    this.globalLayer.addLayer(cssLayer);
}

זה עובד, אבל מכיוון שהשכבות מכילות הרבה עיגולים, זה לוקח קצת זמן לחשב. האם יש דרך פשוט להוסיף מחלקת CSS בלי להסיר ולשוב להוסיף אותן?

ניסיתי

this.globalLayer.eachLayer(layer => {
    layer.setStyle({className: 'animate'})
});

אבל setStyle() אינו קיים בסוג L.Layer

JsFiddle עם הפתרון הנוכחי שלי, פתרון עקיפה

תשובה #1

תצטרך להוסיף כיתה לשכבה המתאימה לפני שתוסיף אותה לתוויות אחרות, כמו

circleLayer1.setStyle({className: 'myListener'});

ואז אתה יכול למצוא את השיעור הזה בכל פעם שתרצה:

$('#blink').click(function() {
    $(".myListener").addClass("blink");
});

כינור

תשובה #2

אני לא בטוח אם זה המעשה הטוב ביותר אבל מצאתי שאתה יכול להשתמש בתכונת _path של השכבה:

this.globalLayer.eachLayer(layer => {
    layer._path.classList.add('animate')
});