本文针对使用html2canvas生成H5图片仍模糊的问题提供解决方案。当DOM宽度设置为100%，导致图片模糊时，可复制DOM并设置目标像素宽度，如1080px，调整元素大小，然后使用html2canvas生成清晰图片。同时，为避免影响原页面，可将用于截图的DOM隐藏，通过z-index和opacity实现不显示。
这文章到现在才出现是因为网上的绝大部分教程都能解决大部分遇到图片不清晰同学的问题，所以没必要再开帖。
本来国内技术论坛就充斥着各种重复复制和转载的文章，一搜技术问题出来100条结果，90条都是重复的，极大浪费大家时间，我是不喜欢干这种事情的。
本帖是解决少部分同学按照教程使用了他人方案以后依然很模糊问题的，其实并非那些教程无效，所以大家依然可以按照诸如以下教程的用dpi和scale参数等方法去尝试解决不清晰问题：
教程2：html2canvas生成图片模糊 不清楚？两种解决方法
如果上述办法依然无法解决再来往下看。
基本上尝试了上述方法后依然很模糊的都是要截图的DOM节点宽度设置成为了100%的，这样会导致实际生成的图片宽度就是屏幕的物理宽度，基本上是375px左右，有些人会觉得纳闷，为什么保存后的图片宽度是1000+px，宽度足够但就是很模糊，那是因为基础图片还是只有300多px的宽度，只是因为dpi和scale设置的缘故导致最后得到的图片宽度很大，所以并没有什么用，只是图片变大了，清晰度依然是个问题。
知道问题的原因后就想办法去解决这个问题，可以尝试把要生成图片的DOM复制出来一段
最低0.47元/天 解锁文章
扫一扫
6210
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
