Estoy intentando crear una animación SVG simple usando SVG.js. Mi resultado deseado sería equivalente a:

 <filter"> <feDiffuseLighting result="diffOut" in="SourceGraphic" diffuseConstant="1.2" lighting-color="white"> <feDistantLight azimuth="240" elevation="100"> <animate attributeName="elevation" values="100; 20" dur="7s" /> </feDistantLight> </feDiffuseLighting> <feComposite in="SourceGraphic" in2="diffOut" operator="arithmetic" result="diffPointOut" k1="1" k2="0" k3="0" k4="0" /> </filter>

A partir de ahora pude replicar todo menos la animación usando svg.js y svg.filter.js:

 foreground.filterWith(function (filter) { diff = filter.diffuseLighting().attr({ 'lighting-color': 'white', 'diffuseConstant': 1.2 }); dLight = SVG('<feDistantLight azimuth="240" elevation="100"/>'); diff.add(dLight); filter.composite(filter.source, diff) .attr({ operator: 'arithmetic', k1: 1, k2: 0, k3: 0, k4: 0 }); });

Este fragmento de código genera en el DOM resultante exactamente el mismo filtro sin la animación. Para agregar una animación, he intentado usar:

 dLight.animate(7000, 0, 'now').attr({ "elevation": 20 });

Pero provoca un error al declarar que 'dLight' no tiene una función llamada 'animar'. Si trato de crear mi propio corredor de animación svg.js y le paso dLight, causaría un error similar, declarando que no tiene una función '_prepareRunner'.

Por otro lado, puedo animar cualquier atributo de 'diff': el filtro de luz difusa está bien. Lo que significa que mi problema probablemente se deba a una forma en que solía crear el filtro de luz distante a través del método SVG (...), pero no encontré otro método para crearlo, ya que según la última publicación aquí: https://github.com/ svgdotjs/svg.filter.js/issues/18 svg.filter.js ya no proporciona un constructor.
Estoy buscando ayuda para agregar una animación al resultado de la llamada SVG (...) o crear un filtro de luz distante de una manera animable más adecuada.