I'm using c3 to draw a multi chart. but I'm having trouble exporting! I've read a few articles to solve this problem, but it's hard to understand.
How can I fix it to export?
When I click Export button, execute blow code.
const exportSvg = function () {
const svg = document.querySelector('svg');
console.log('svg!!!', svg);
const { x, y, width, height } = svg.viewBox.baseVal;
/*const blob = new Blob([svg.outerHTML], { type: 'image/svg+xml' });*/
const blob = new Blob([svg.outerHTML], { type: 'image/png' });
const url = URL.createObjectURL(blob);
const image = document.createElement('img');
image.src = url;
image.addEventListener('load', function () {
const canvas = document.createElement('canvas');
canvas.width = width;
canvas.height = height;
const context = canvas.getContext('2d');
context.drawImage(image, x, y, width, height);
const link = canvas.toDataURL();
URL.revokeObjectURL(url);
});
downloadSvg('test.png', url)
}
const downloadSvg = function (name, dataUriString) {
console.log('dataUriString', dataUriString);
let link = document.createElement('a');
link.addEventListener('click', function () {
link.href = dataUriString;
link.download = name;
document.body.removeChild(link);
}, false);
document.body.appendChild(link);
link.click();
}