时间戳

首页 > 解决方案 > 在 SMIL 中，为同一 GROUP 中的所有 CIRCLES 和 LINES 的 STROKE-WIDTH 设置动画

svg-animate - 在 SMIL 中，为同一 GROUP 中的所有 CIRCLES 和 LINES 的 STROKE-WIDTH 设置动画

问题描述

Inkscape SVG

链接是来自网页的位置地图。请注意位于 8 点钟方向的 Santa Fe New Mexico 的位置点（圆圈）。看看它是如何跳动的。那就是为那个特定的 CIRCLE 设置 STROKE-WIDTH 动画。

我想要做的是在同一组中的所有对象上调用相同的 STROKE-WIDTH 动画。对整个组产生影响的单个动画命令。这样所有组合在一起的圆和线都将作为一个脉冲。并用一个命令来完成。

它发生在 Inkscape 中。我可以选择一个组，并更改一个属性，并且所述效果会在整个组中发生。我想在 SMIL 中做到这一点。

为什么？因为这张地图是来自单个天线的业余无线电联系人，但在不同的频段上。现在它是静态的，并且使用颜色。但这太忙了。也不清楚。我想让标签出现，比如“160m”、“80m”等......同时所有与该频率相对应的位置都会在标签显示时变得更胖。像这样一秒钟。然后显示一个新标签，并且它自己的一组位置显示更胖。等等。

但是如果我必须为每个圆圈调用一个单独的动画，而不是让它从组中继承，那就太乏味了，因为每次我可能添加一个新位置时，我都必须为此编写一个单独的动画。相反，我想将该新圈子分配给一个组，然后就可以了。

可行吗？如果是这样，怎么做？请举例。

谢谢！

甘椋鸟，KY8D

标签： svg-animatesmil

解决方案

As turns out, that's not possible. At least not wholly via SMIL.

I found I could do it instead via CSS, by embedding @keyframes rules.

I have modified the example to show this adjustment.

推荐阅读