关于html2canvas截图模糊的CDN版本差异的一个坑

问题

项目使用html2canvas截图，存在截图模糊。左边是原html，右边是html2canvas生成的截图，明显发现html2canvas生成的模糊一大截

查了解决办法，解决html2canvas截图模糊的问题里提到新版的html2canvas里有dpi和scala选项。尝试使用。

 html2canvas($("#bg"),  { scale: 2 }).then(canvas => {document.body.appendChild(canvas);});

发现失败还是一样的模糊，然后一直找不到原因。

问题所在

突然想起来我的html2canvas最开始是用cdn引入的，使用的是bootcdn的0.5.0-beta4版本。

网页打开发现html2canvas实际上发现它是 0.5.0-beta3！而只有最新的0.5.0-beta4才支持scala和dpi属性！！挂羊头卖狗肉属于是！！！！浪费了我半个小时……

解决

直接手动去官网下个最新版放到项目……或者下tag为：1.0.0-rc.7 也行。反正注意版本问题！
eKoopmans/html2canvas

完美解决~以后用cdn如果有奇怪的bug第一条解决方案应该是去对版本！

关于html2canvas截图模糊的CDN版本差异的一个坑相关推荐

提高html2canvas截图精度 / 提高dpi
项目中要实现div的截图功能,使用了html2canvas截的图比较模糊,我之前也记录过这个问题,html2canvas 实现网页截图,但是现在要对截图的精度进行优化,截出来的图片要实现打印照片的功能 ...
html2canvas 截图div_浏览器端网页截图方案详解
简介剖析流行的截图插件 html2canvas 的实现方案,探索其功能上的一些不足之处及不能正确截取的一些场景,比如不支持 CSS 的 box-shadow 截取情况等.探索一种新的实现方式,能够避 ...
tensorflow r1.5 版本差异调研
原文:http://blog.csdn.net/SuperYR_210/article/details/78977588 tensorflow r1.5 版本差异调研一.Breaking Chang ...
android截图canvas为空,html2canvas截图空白问题的解决
最近在项目中遇到一个需求,需要提供网页截图的功能.百度下发现html2canvas很好用.那就试试吧. 资源下载地址使用方式项目使用的react组件开发方式.参照官方的说明文档getting-st ...
python版本差异_npm install报错，不知道是系统差异还是node版本差异，跟python有关系？...
源自:1-3 项目安装 npm install报错,不知道是系统差异还是node版本差异,跟python有关系? > gmsmith@0.1.3 preinstall D:\code\imooc ...
手机比较版本差异工具
CompareVersionDiff 导出每个手机版本的里面apk.property.xml配置,然后对比2个不同的版本之间的差异,来确认是否有非预期的修改被带入背景: 手机项目开发进入后期,相关的 ...
在vue项目中使用html2canvas截图（固定区域截图）
1.项目目录下,打开dos窗口使用cnpm安装html2canvas插件. cnpm isntall html2canvas 2.在使用html2canvas的页面中,引入插件. import htm ...
html转换成canvas一片空白,html2canvas截图空白问题怎么解决 html2canvas截图空白问题解决方法...
本篇文章小编给大家分享一下html2canvas截图空白问题解决方法,通过代码图文详细分析了问题及解决方法,小编觉得挺不错的,现在分享给大家供大家参考,有需要的小伙伴们可以来看看. 项目使用的reac ...
前端 - html2canvas 截图显示空白
一.工作原理 html2canvas库的工作原理并不是真正的"截图",而是读取网页上的目标DOM节点的信息来绘制canvas,所以它并不支持所有的css属性. 二.在 img标签中 ...

关于html2canvas截图模糊的CDN版本差异的一个坑

问题

问题所在

解决

关于html2canvas截图模糊的CDN版本差异的一个坑相关推荐

最新文章

热门文章