本文介绍了Canvas图像裁剪器 - canvas.toDataURL异步执行此操作会返回任何类型的承诺的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如果我使用结果在'toDataURL'和画布绘制之间发出警报,那么一切都按预期进行。

If I put an alert between 'toDataURL' and a canvas draw using the result then everything proceeds as expected.

toDataURL是否在画布上触发事件或应该我使用某种'onLoad'作为我设置的图像src?

Does toDataURL fire an event on the canvas or should I use some kind of 'onLoad' for the image src I am setting it to?

IE img.addEventListener('load',function(){...}

IE img.addEventListener('load',function(){...}

推荐答案

.toDataURL 是一种不会触发任何事件的同步操作。

.toDataURL is a synchronous operation that does not trigger any events.

同步,它是一个阻塞操作,所以不需要 alert 来防止在toDataURL之前执行下一个命令完全完成。当toDataURL完全完成时,下一个命令将执行。

Being synchronous, it's a blocking operation so no alert is required to prevent the next command from executing before toDataURL is fully complete. The next command will execute when toDataURL is fully complete.

由于你使用dataURL作为图像源,你需要给那个图像时间通过分配回调加载:

Since you're using the dataURL as an image source, you will want to give that image time to load by assigning a callback:

var img=new Image();
img.onload=function(){
    ctx.drawImage(img,0,0);
}
img.src=canvas.toDataURL();

这篇关于Canvas图像裁剪器 - canvas.toDataURL异步执行此操作会返回任何类型的承诺的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-23 17:47