我正在使用fabric.js创建一些动画。
现在，我想创建动画的gif，因此希望以20 fps的速度进行“画布捕获”。即每秒20 png。然后，我可以使用convert将png转换为gif。
我正在使用node.js在服务器上运行动画。
问题：如何在动画运行时保存png？它不必实时编写或处理，因为它仅在服务器端运行。
wangshuaiws0 回答：Fabric.js-保存动画快照
您可以拥有这样的食物。
var blob_array = new FormData(),png_index = 0;
function canv2blob(canv) {
return new Promise(function(resolve,reject) {
canv.getElement().toBlob(function(blob) {
resolve(blob);
},'image/png',0.8); //0.8 is quality. keep it as you like
});
}
function process_blob(canv){
canv2blob(canv).then(function(blob){
blob_array.append(png_index,blob);
});
}
然后在每个织物动画的onChange事件中，调用该函数以创建一个包含png blob的FormData对象，您可以将其发布到服务器。
onChange: function(){
canvas.renderAll.bind(canvas);
process_blob(canvas);
png_index++;
},