miniminixu 2017-06-18 21:57 采纳率: 75%
浏览 4528
已结题

html2canvas在360浏览器兼容模式下报错问题

需求是将页面上的一张图表做前端导出,我用到了两个插件,一个是html2canvas进行截图,还有一个是jspdf生成pdf文件并且保存到本地
firefox和chrome都已经通过测试了,360的兼容模式下不能正常跑。

代码跑到这里的时候会报错:
html2canvas($("#vm0"), {
onrendered: function (canvas) {
$(canvas).attr({"style":"margin-top:10px;","id":"vm0_save"})
$("#realchart").append(canvas);
}
});

刚开始浏览器控制台抛出这个错误:

图片说明

下了一个es6-promise依赖包,然后在html2canvas.js最上面加了一句:
var Promise = require('es6-promise').Promise;
这个报错就不再出现了,但是随之而来的是下面这个报错:

图片说明

然后就没有什么头绪解决了,有遇到过这个问题的大神吗? 另外发现html2canvas的坑挺多的,有没有可以替代它的插件

  • 写回答

7条回答 默认 最新

  • 斯洛文尼亚旅游 2017-06-18 22:09
    关注

    兼容模式是IE浏览器,一般内核就是ie7,ie8之类的,Promise是es6语法了,不兼容ie7,8。要兼容性好就在服务器端生成,而不是用客户端js

    评论
  • miniminixu 2017-06-18 22:45
    关注

    因为是要将echarts导出,echarts的直接转成base64的时候有个黑底,但是又不能简单的通过添加背景颜色去解决。我看了一下echarts渲染图表的节点,环形图是分了3个canvas在渲染,一个放背景颜色,一个放一些气泡动画,还有一个放图表内容。也就是我想导出的那个包含图表内容的canvas节点,是无法通过config去配置它的底色的。。。。也许改源码可以,但是这个超过能力范畴了。总的来说就是无论后台生成还是前端直接导出,我都要用到html2canvas去截这个图。但现在这个插件的代码在IE下面跑不下去。

    评论
  • miniminixu 2017-06-18 22:54
    关注

    另外为什么不用echarts自带的图片导出: 一是因为除了图片还有一个pdf格式的需求,二是因为一个页面是由多张图表组成的,美工要求导出的文件排下版一起导出

    评论
  • ht121907 2017-07-10 00:55
    关注

    楼主,解决了吗,我的也是这个问题,尝试使用了ie 兼容补丁也是不行

    评论
  • liusaijin 2017-07-16 22:02
    关注

    你好?请问解决了吗?我现在也是使用html2canvas在360兼容模式下报错,另外保存如何将base64图片保存到本地。要考虑ie的兼容性。

    评论
  • 倾听-静轩水月 2017-08-02 18:42
    关注

    楼主解决了吗?我也是这个问题,求解决方案

    评论
  • 一笑程序猴 2017-09-24 22:33
    关注

    IE8调试了下,其中有句代码t.getComptedStyle(e,n)报错了, 原因是ie8不支持getComputedStyle方法,改为e.currentStyle?e.currentStyle:t.getComputedStyle(e,n),是可以解决这个问题了,但是后面还有其他问题引出。暂时无解。

    评论
编辑
预览

报告相同问题?

悬赏问题

  • ¥25 Android上传文件报错 java.net.SocketException: Broken pipe
  • ¥15 有关汽车的MC9S12XS128单片机实验
  • ¥15 求c语言动态链表相关课程有偿,或能将这块知识点讲明白
  • ¥15 FLKT界面刷新异常
  • ¥15 物体双站RCS和其组成阵列后的双站RCS关系验证
  • ¥50 单细胞测序拟时序分析
  • ¥50 运行springboot项目报错
  • ¥15 FTP 站点对站点传输失败
  • ¥15 宝塔面板一键迁移使用不了
  • ¥15 求一个按键录像存储到内存卡的ESP32CAM代码
手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区,与千万技术人共成长

专业的中文 IT 技术社区,与千万技术人共成长

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

客服 返回
顶部