Сохраните svg на диск как изображение png - несоответствие браузера

Question

Я пытаюсь сохранить файл, как png-изображение, сюжет svg, который был создан с помощью d3.js. Этот код отлично работает на Chrome (сохраняет файл на диск), но не работает в Firefox 32. Любые идеи, почему?

$(".savePNG").click (function() { 
    var svg = ($("#svgContainer")[0]).getElementsByTagName("svg")[0]; 
    var svg_xml = (new XMLSerializer).serializeToString(svg); // extract the data as SVG text 
    var data_uri = "data:image/svg+xml;base64," + window.btoa(svg_xml); 

    var image = new Image; 
    image.src = data_uri; 
    image.onload = function() 
    { 
     var canvas = document.createElement("canvas"); 
     canvas.width = image.width; 
     canvas.height = image.height; 

     var context = canvas.getContext("2d"); 
     context.clearRect(0, 0, image.width, image.height); 
     context.drawImage(image, 0, 0); 

     var a = document.createElement("a"); 
     a.download = "file.png"; 
     a.href = canvas.toDataURL("image/png"); 
     a.click(); 
    }; 
}); 

Если он обеспечивает любой ключ console.log (svg_xml.length + " " + data_uri.length);
на Chrome возвращает 3501304 4668434 и 3060753 Firefox 4081030. Так что, казалось бы, что Firefox не хватает некоторых данных, но я не знаю, что делать.

Answer 1

Как предлагалось, метод .click() не работает для firefox. Но window.open(a.href, "_blank"); будет работать и открыть новое окно с изображением в нем. Вы можете щелкнуть правой кнопкой мыши, чтобы сохранить его.