html2canvas截图问题小结

传送门：html2canvas官网

原理：

首先 html2canvas 截图的原理是分析需要截图的dom元素部分，这部分需要截图的dom是需要显式存在整个页面的dom文档流中的，意思就是需要被截图的dom的样式不能是隐藏（opacity: 0 或 displa: none）。

场景：移动端H5页面海报分享，页面海报显示和保存的海报需要不一样（如带上用户昵称等）？

小结：

既然显示的和保存的海报需要不一样，又需要生成的海报显示存在dom中，其实可以使用绝对定位，并调整一下截图区域的层叠关系z-index即可，这样截图区域满足两个条件，1存在dom中，2也显式存在，只不过设置了层叠关系，让它被看不到而已。

保存的截图清晰度

截图的清晰度可能和画布设置的大小有关，可以设置画布大小和需要截图的区域大小一致。