html2canvas 截取某一个DIV里面画的图，但是截取下来里面的内容重影，求大神解决

菜鸟一个两个 2017-08-09 11:53:18

这图我用的是echarts 画出来的

如图所示页面上的内容重影了请问大神怎么解决，

...全文

508 1 打赏收藏转发到动态举报

写回复

1 条回复

切换为时间正序

请发表友善的回复…

发表回复

斯洛文尼亚旅游 2017-08-09

打赏
举报

回复

echarts就附带了保存功能，你通过html2canvas来搞什么。。

代码为博客实例代码http://blog.csdn.net/lmj623565791/article/details/34089553 有问题博客中留言

说实话，我也不是很熟，但是确实实现了，利用html2canvas截取百度地图很简单，但是要把覆盖物下下来却很难，尤其是轨迹，我是差了很多很多很多资料，最后综合了好几家给解决了；大概思路也说不好，反正就是先转矢量图，在转png格式；话不多说，上代码第一步，引入html2canvas.js <script src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script> 第二步直接调用c

Html2canvas是什么? 是一个脚本这个脚本可以允许用户直接在浏览器上拍摄网页或其中一部分的"屏幕截图".屏幕截图是基于DOM,因此可能无法真实表示100％的准确度，因为它无法生成实际的屏幕截图，而是根据页面上的可用信息构建屏幕截图。运行过程? 脚本遍历加载页面的DOM。它收集那里所有元素的信息，然后将其用于构建页面的表示形式。换句话说，它实际上并不截取页面的屏幕快照，而是根据它从DOM读取的属性来构建页面的表示形式。所以可能有些这个脚本识别不了的css或者html将会在编译过程中失效!

　　今天在研究html2canvas截取页面的时候，发现截取后的图片没有把应该截取元素的背景图片截掉，背景图片空白。此时谷歌浏览器控制台报Failed to load resource: net::ERR_CACHE_MISS 和图片跨域的错误。　　使用了useCORS: true后还是无法解决这个问题。于是就自己想办法，既然不同域名下的图片会有跨域问题，那么将图片转成base...

1.首先引入js（这个js可以解决保存的图片模糊问题） js下载地址：https://github.com/eKoopmans/html2canvas/tree/develop/dist import html2canvas from '~/assets/js/html2canvas.min.js'; // 引入截图js 2. downLoadTcPhoto() { //点击下载图片按钮 this.$nextTick(()=>{ wind

87,993

社区成员

224,694

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章