问题标签 [bodymovin]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Bodymovin 只悬停播放一次动画
让我的动画在悬停时触发播放。我一切正常,但是当我尝试再次悬停播放时,似乎没有任何效果。
有什么想法我写错了吗?
javascript - Bodymovin 按需循环播放片段
我有几个图标,它们有一个介绍动画 [0,20],它们在其中被绘制,当您将鼠标悬停在图标上时,还有一个循环动画 [21, 100]。将 loop 设置为 true 将使我的所有段循环,这不是我想要的,我只需要其中一个段循环。无论如何都要这样做?
这是我如何设置代码的示例:
最终答案编辑:
我的实现受到了正确答案的启发,但与正确答案有点不同,所以我认为值得一提。我基本上将相同的动画加载到彼此重叠的两个元素中。这两个 DOM 元素通过 CSS 切换为默认和悬停模式。唯一的区别是我操纵数据对象并将循环更改为 true 以获得悬停效果!所以我发现没有必要回到我的动画师那里并要求他们将动画分割成不同的文件。
javascript - 使用 bodymovin JSON 更改 SVG 上的视图框值
处理 bodymovin 的新手。有没有办法在将导出的 SVG 解析到浏览器后更改其视图框,或者通过使用 Javascript,或者通过编辑 data.json?基本上我希望视图框的最终输出为“50 0 400 400”。我可以通过更改 data.json 中的“w”和“h”属性来更改最后两个值。
javascript - Angular4 中的 bodymovin,修复未定义的 appendChild
我在我的项目中使用 bodymovin 脚本。即使我的一些动画 SVG 在浏览器中呈现,我仍然收到此错误
根据这个答案,我想我应该在页面上的所有内容加载后运行 bodymovin 脚本。我已经更新了代码,考虑到了新的建议
索引.html
app.component.ts
app.component.html
动画.js
canvas - After Effects bodymovin 进入 PIXI.js
在这个后效示例中,它显示了renderer: 'pixi'
我想知道这是否会使用 pixi js 渲染器技术或者它会创建一个用于制作动画的 pixi js 画布的选项。
还想知道是否可以将效果动画加载到 pixi js 中?
javascript - 为什么我的 Bodymovin.js loopComplete 事件在动画完成之前触发?
我正在尝试使图标在单击时具有动画效果。我希望动画在重新启动之前完成。
我首先通过选择元素来构建我的图标,然后使用它们的 id 通过路径选项加载动画数据:
然后循环图标对象并调用 animationStart 方法以及添加到每个图标容器的单击处理程序:
startAnimation 方法尝试附加一个事件处理程序以在 loopComplete 事件发生时触发。
但是,这似乎会立即触发,我想知道如何在动画之后触发它,这样我才能在它完成之前开始新的动画。
我在这里做了一个简化的测试用例:https ://codepen.io/paulyabsley/project/editor/ALEWnK
bodymovin.js 的文档:https ://github.com/bodymovin/bodymovin
javascript - Bodymovin 展示更狂野的动画
我们用 Body Movin 制作了一些动画,效果都很好。我们现在遇到的问题是,Body Movin 动画的动画与它应该动画的内容相比实在是太疯狂了。
原创动画:
Bodymovin动画:
你可以在这里测试和玩耍: https ://codepen.io/albertdp/project/editor/AmbRgM
我用它在演示中的方式来称呼它。
如果您遇到同样的问题,请告诉我。
node.js - JSON 动画导出为 Video mpeg
我有一个在 AfterEffects 中创建的 json 动画,用 BodyMovin 导出。 https://github.com/bodymovin/bodymovin
有没有办法获取这个 json 文件并以编程方式将其转换为视频?基本上,我正在尝试创建一个 JibJab 风格的视频,用户可以在其中输入他们的脸部照片,我们的应用程序将获取该脸部并将其放置在动画上。我需要将该动画转换为可以保存到用户手机中的视频文件。也许用ffmpeg?
android - 我可以在不以编程方式调用 setProgress() 的情况下开始几帧并循环其余帧吗?
我想制作一个动画,例如显示从非常小的尺寸到正常尺寸的东西,然后重复(循环)一组帧。
仅使用 AE + Bodymovin 就可以实现吗?
我知道我可以将帧设置为 0 到 100,然后在 101 到 300 帧之间循环,但是如果有某种方法可以在 json 文件中指定它会很好。