d3.js 스펙트럼 canvas 그림으로 내보내기 로컬 저장 - Chrome, 불여우, IE 호환

downloadImg() { //    canvas   png  
var serializer = new XMLSerializer();
var source = serializer.serializeToString(this.svg.node());

source = '\r
' + source;
var url = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(source);
var image = new Image;
if (this.canvas.msToBlob) {//   IE9+   
image.src = url;
var blob = this.canvas.msToBlob();
window.navigator.msSaveBlob(blob, "graph.jpg");
} else { // chrome、   
image.onload = function() {
this.context.drawImage(image, 0, 0); //      loaded   draw，        'Component is not available'
}
image.src = url;
var a = document.createElement("a");
document.body.appendChild(a);
a.download = "graph.jpg";
a.href = this.canvas.toDataURL("image/jpg");
var evt = new MouseEvent('click', {view: window, bubbles: true, cancelable: true});
a.dispatchEvent(evt);
document.body.removeChild(a);
}
}

아무 말 없이 바로 코드로 갈게요~