Javascript 使用plotly.js动画功能

昨天精心发布了新功能动画！！！所以我很想测试一下，由于目前缺乏文档（我想是暂时的），我在如何使用它上有点困难。 我确实在GitHub上看到了代码，但是。。。不工作

我在模板中定义我的div元素：

<div id="plotDiv"> </div>

然后生成数据（角度魔法和其他东西的位），但最后看起来是这样的：

data = {x: [array_ot_dates], y: [array_of_not_so_random_values], type:'bar'};

根据用于动画功能的jsdocs，您需要传递一帧：

let plotlyFrame = {data:data, layout:{}};

尝试调用动画

Plotly.animate(gd, plotlyFrame);

这就是卡布姆

第一个错误是：此元素不是Plotly plot:[object htmldevelment] 但当我尝试这个：

Plotly.newPlot(gd, data, {});

我有我的阴谋

所以我试图通过调用Plotly.plot和空数据“预定义”gd，然后调用animate函数

Plotly.plot(gd, [], {});
// make my data not empty
Plotly.animate(gd, plotlyFrame);

然后我得到以下错误：

plotly.js:116922未捕获（承诺中）类型错误：无法读取未定义（…）的属性“\u module”

第二个可能是因为我使用angular函数，因此在一行中的某个点调用函数3次

---

有什么建议吗？想法

我是制作动画功能的人！首先，您可以在这里找到文档

关于您的具体问题，答案似乎是您需要在设置动画之前对绘图进行初始化（我会将其添加到文档中！）。例如：

var帧=[{
数据：{
y:[…新值…]
}
}]
plot（gd，[{x:[…]，y:[…]}]）。然后（function（）{
Plotly.animate（gd，帧）
});

如果某种类型的用户输入正在触发动画，则可能不需要承诺（因为输入事件将处理事情，并且在

Plotly.plot

有机会初始化之前不太可能触发）

此外，至少我认为您需要使用希望设置动画的轨迹实际初始化绘图。我认为您可能不需要空数据，但您仍然需要至少定义一个跟踪，例如

Plotly.plot（gd，[{x:[]，y:[]）

。我认为您尝试修复的问题是，就Plotly而言，跟踪列表的

[]

仍然是空的，因为这并不能说明存在的跟踪类型。另外，供参考，该功能的一个设计目的并不是以一种奇特的方式绘制初始情节。这可能是可以实现的，但是如果在一个空的绘图上设置

动画

，它不是自动的

---

我希望这足以澄清问题！这是一个相当大的功能，所以我们希望得到反馈，并听到它的成功/失败

您的网站上是否有类似的例子，因为它确实有助于轻松理解plotly的工作原理。@oro777您能澄清一下您的意思吗？在plot.ly/javascript/站点上？这里有很多例子，我在这个答案中发布的即将发布的动画文档的链接应该在一天或两天内进行直播。好的，我明白了，我希望你能让这些例子在你的代码笔中进行直播。在plot.ly/javascript上有一些示例，但我只想有几个不同来源的plotly示例：）无论如何，我期待着plotly中动画功能的未来。哦！非常适合所有的信息！！！谢谢！！我会玩一点它，希望一切都会很好手指交叉伟大的工作为动画公关顺便说一句，我几乎每天检查了3个星期，当它会被合并！！很高兴它被发布了！我们两个！目前正致力于清理一些未解决的问题，并突破其能力的极限！：）

Plotly.plot(gd, [], {});
// make my data not empty
Plotly.animate(gd, plotlyFrame);