海报、截屏、水印，这些常见的业务需求都离不开一个库，那就是 html2canvas。把 DOM 转化为 Canvas，仅仅需要一个 API。
const canvas = await html2canvas(document.querySelector("#capture"))
那你知道 DOM 转为图片的原理是什么吗？[1]
大概是基于以下链条
-
DOM -> foreignObject -> SVG -> Canvas -> JPEG/PNG
如果要实现相同的功能，还可以使用以前介绍过的另外一个库。
-
dom-to-image[2]: Generates an image from a DOM node using HTML5 canvas
参考资料
那你知道 DOM 转为图片的原理是什么吗？: https://github.com/shfshanyue/Daily-Question/issues/437
[2]dom-to-image: https://github.com/tsayen/dom-to-image
文章评论