이미지 다운로드는 크롬에서는 작동하지만 파이어 폭스에서는 작동하지 않습니다.

Question

SVG를 PNG로 다운로드하는 기능이 있습니다. 그것은 크롬에서 잘 작동하지만 다운로드는 파이어 폭스에서 실행되지 않습니다. 무엇을 바꾸어야합니까?

function downloadGraph(contextDivId){ 

var svgselect = $("#"+contextDivId).children("svg")[0], 
xml = new XMLSerializer().serializeToString(svgselect); 

var imgsrc = 'data:image/svg+xml;base64,'+ btoa(unescape(encodeURIComponent(xml))); 
var img = '<img src="'+imgsrc+'">'; 
$("#svgdataurl").html(img); 

var bbox = svgselect.getBBox() 
var canvas = document.querySelector(".downloadcanv"); 
$(canvas).attr("width",bbox.width); 
$(canvas).attr("height",bbox.height); 
var context = canvas.getContext("2d"); 

var image = new Image; 
image.src = imgsrc; 

context.drawImage(image, 0, 0); 

    var canvasdata = canvas.toDataURL("image/png"); 

    var pngimg = '<img src="'+canvasdata+'">'; 
    $("#pngdataurl").html(pngimg); 

    var a = document.createElement("a"); 
    a.download = "Graph.png"; 
    a.href = canvasdata; 
    a.click(); 
} 

Answer 1

그것은 오래된 게시물지만 트릭을 할 가능성이 높습니다.

https://gist.github.com/jweir/706988

// Works in recent Webkit(Chrome) 
$("body").append($("<img src='data:image/svg+xml;base64,\n"+b64+"' alt='file.svg'/>")); 

// Works in Firefox 3.6 and Webit and possibly any browser which supports the data-uri 
$("body").append($("<a href-lang='image/svg+xml' href='data:image/svg+xml;base64,\n"+b64+"' title='file.svg'>Download</a>")); 

: 그것은 파이어 폭스에 대해 다른 형식을 제안합니다