htmlToCanvas

前端 2022-06-22

2022-06-22

利用时间是一个极其高级的规律。——恩格斯

今天分享一个html转canvas的插件：

使用方式特别简单：

引入：

1 2	pnpm install --save html2canvas # import html2canvas from 'html2canvas';

或者直接上link

1	<script src="http://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>

需要转换的html节点

1
2
3

<div id="capture" style="padding: 10px; background: #f5da55">
    <h4 style="color: #000; ">Hello world!</h4>
</div>

使用：

1
2
3

html2canvas(document.querySelector("#capture")).then(canvas => {
    document.body.appendChild(canvas)
});

效果：