Dygraph javascript to PNG incorrect zoom

Question

I have a question regarding dygraphs in javascript. I have created a graph and want to export it to a PNG image:

function drawChart() {
            g = new Dygraph(document.getElementById("dg_div"),

function export_graph() {
            let img = document.getElementById('dg_img')
            Dygraph.Export.asPNG(g, img)

This produces the following graph: graph And the following PNG image: PNG

The PNG is incorrectly zoomed in to the graphs top left corner, tho the axes remain the correct size.

I have tried things like .resetZoom() or checking if the user options have any effect. They do not. It seems to be a problem in the dygraph-extra library. Any solutions would be a big help!

Answer 1

The dygraph-extra library needs a little change:

Dygraph.Export.drawPlot = function (canvas, dygraph, options)

This function needs to change this line:

ctx.drawImage(plotCanvas, 0, 0);

Into this:

ctx.drawImage(plotCanvas, 0, 0, canvas.width, canvas.height);