SVG组的CSS动画

与我在这里提到的问题不同，我试图用CSS获得动画效果，因为我将它应用于JS。我很高兴用动画过滤器实现同样的效果，但我不知道如何。SVG组的CSS动画

为什么我的CSS动画不能在SVG组上工作？如果我将它应用于SVG本身，它的确行得通。如何在这里通过示例在SVG中使用CSS对组进行动画处理。 FIDDLE here too.

.pulse { 
    background: blue; 
    width: 400px; 
    height: 100px; 
    animation-name: example; 
    animation-duration: 4s; 
    animation-iteration-count: infinite; 
} 

@keyframes example { 
    0% { 
    filter: brightness(1); 
    filter: contrast(1); 
    -webkit-filter: brightness(1); 
    -webkit-filter: contrast(1); 
    } 
    50% { 
    filter: brightness(0.1); 
    filter: contrast(0.1); 
    -webkit-filter: brightness(0.1); 
    -webkit-filter: contrast(0.1); 
    } 
    100% { 
    filter: brightness(1); 
    filter: contrast(1); 
    -webkit-filter: brightness(1); 
    -webkit-filter: contrast(1); 
    } 
}

来源

2017-09-06 TheRealPapa

如果您想在svg元素上使用动画，请检查https://css-tricks.com/guide-svg-animations-smil/。它可能会帮助您 –

嗨@Ovidiu Unguru感谢您的链接。已经阅读并认为它不仅仅是我想要达到的目标。我有其他类应用到'g'元素，所以我不明白为什么这个不起作用。 – TheRealPapa

[动画SVG组]的可能重复（https://stackoverflow.com/questions/41872057/animating-an-svg-group） – LuudJacobs