How to download canvas image?

Question

JavaScript

I convert SVG to PNG, then I need to make a download button, but I don’t know how to do it.
The image is converted (I check by adding it to the page)

// Добавил функцию к кнопке
        var buttonConvert = document.getElementById("convertBtn");

// Нахожу svg и в Canvas засовываю 
        buttonConvert.onclick = function svgToCanvas(){
            // Select the first svg element
            var svg = d3.select("svg")[0][0],
                img = new Image(),
                serializer = new XMLSerializer(),
                svgStr = serializer.serializeToString(svg);

            img.src = 'data:image/svg+xml;base64,'+window.btoa(svgStr);

//Делаю для себя проверку что все работает, вижу что элемент добавился
            var canvas = document.createElement("canvas");
            document.body.appendChild(canvas);

            //saveAs(canvas, "chart.png");

            canvas.width = width;
            canvas.height = height;
            canvas.getContext("2d").drawImage(img,0,0,width,height);

 // Вот тут заминка, на работает функция, а нужно еще и для всех браузеров
// включая EI10+
            canvas.download = ("chart.png");

Help me figure out what I'm missing?

Answer 1

I used this library.
https://github.com/eligrey/FileSaver.js/
Here is an example where it works from (FF, Chrome, IE10+ ): https://eligrey.com/demos/FileSaver.js/