将 SVG 动画的结尾保存为 png（快速）答案

【问题标题】：Save end of SVG animation as png (quickly)将 SVG 动画的结尾保存为 png（快速）
【发布时间】：2021-05-17 07:50:40
【问题描述】：

以下动画 svg 显示了一个从左向右平移的点：

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="432px" height="574px" viewBox="0 0 432 574">
<path d="M217.074,165.651c-36.607,0-66.268,29.589-66.268,66.307c0,36.597,29.66,66.274,66.268,66.274c36.642,0,66.367-29.678,66.367-66.274C283.441,195.241,253.716,165.651,217.074,165.651" fill="#CC0000">
<animateTransform attributeName="transform" type="translate" from="0" to="90" dur="0.01s" fill="freeze"/>
</path>
</svg>

我需要将 svg 以它在动画结尾时的格式保存为 png/jpg。我目前的方法是为动画设置一个非常短的持续时间，最后使用 fill="freeze" 停止它，然后使用 Javascript 在 Chrome 中自动截屏。但是，一个屏幕截图大约需要 0.3 秒，我需要为数千个 svg 执行此操作，因此我需要加快速度。还有其他方法可以实现吗？谢谢！

【问题讨论】：

标签： javascript python svg svg-animate animatetransform

【解决方案1】：

似乎没有办法实现这一点。最后我的解决方法是编写一个函数来插入 animateTransform 语句，将它们插入到 SVG 代码中，并在每个插值步骤中存储一个 SVG。缺点是这只适用于 animateTransform 语句。

【讨论】：