2016-02-25 238 views
1

我想下载Google Material图表图像。但是现在在材质表中不支持getImageUri函数。所以我做了一些谷歌搜索,并找到了html2canvas lib做这个。下面提到的代码在Chrome中工作正常,但不在FireFox和IE中。html2canvas不适用于FireFox和IE 11适用于Google Material Charts

 html2canvas($(".Tab1"), { 
      onrendered: function(canvas) { 
       var myImage = canvas.toDataURL("image/png"); 
       window.open(myImage); 
       } 
}); 

enter image description here

从Firefox采取上面的照片。在IE浏览器只显示空的浏览器.. 任何人都可以帮助我解决这个问题。

+0

帮助? - > [创建一个图像元素,其源设置为您的dataURL](http://stackoverflow.com/a/17985955/5090771) – WhiteHat

回答

1
The Below Fix Make it working in IE as well (Tested with IE 10) 

This seems to be a parsing error, if I add the following lines at the beginning of the 'svg.parseXml' function my code now works. 

// -- Internet Explorer trick, otherwise an error is generated in the 'parseFromString' function when 
// -- You use declarations, this is the case for Raphael 
xml = xml.replace(/xmlns=\"http:\/\/www.w3.org\/2000\/svg\"/, ''); 

Ref: https://github.com/gabelerner/canvg/issues/189 
0
The below mentioned code working fine in firefox but not in IE 
$('.pngexport').click(function() { 
      canvg(); 
      //saves the d3.js as a png 
      html2canvas($('.Tab1'), { 
      useCORS: true, 
       onrendered: function (canvas) { 
        var img = canvas.toDataURL("image/png"); 
        ////////////////////////// 
        var download = document.createElement('a'); 
        download.href = img;  
        download.download = 'Vendor.png'; 
        download.click(); 
        function fireEvent(obj, evt) { 
         var fireOnThis = obj; 
         if (document.createEvent) { 
          var evObj = document.createEvent('MouseEvents'); 
          evObj.initEvent(evt, true, false); 
          fireOnThis.dispatchEvent(evObj); 
         } else if (document.createEventObject) { 
          var evObj = document.createEventObject(); 
          fireOnThis.fireEvent('on' + evt, evObj); 
         } 
        } 
        fireEvent(download, 'click'); 
       } 
      }); 
     }); 
相关问题