Hi! I’m trying to create printable version of a page with a small graph in the bottom third of the page. It looks fine on screen, and prints correctly, but the resolution of the graph is (unsurprisingly) really low. It’s even more noticeable since the rest of page prints quite nicely being just text.
I tried increasing the dpi by following this stackoverflow post, by using the following:
var canvas = document.getElementsByClassName("canvasjs-chart-canvas");
var i;
for (i = 0; i < canvas.length; i++) {
var dpifactor = 300/96;
var w = canvas[i].width;
var h = canvas[i].height;
canvas[i].width = w*dpifactor;
canvas[i].height = h*dpifactor;
canvas[i].style.width = w + 'px';
canvas[i].style.height = h + 'px';
}
chart.render();
Sadly, while it seems to do something, it doesn’t actually do what I want. Is there a built in function for increasing DPI, or any workarounds?
Worst case I was thinking about generating a graph in gigantic-size, exporting it as a png, then including it, theoretically all in js, but that seems like a really inelegant solution.