Plotly.js modebar, download as png, give png a name

user_4301564 0
Viewed 3912

I have a Plotly on my webpage and you can download it as a png by clicking the picture icon in the modebar. However when I click it, it downloads it as a png with the name new-plot, how can I give it a custom name?

My current code (var data is just data, so left it out) :

var layout = {
    showlegend: true,
    legend: {
        x: 0,
        y: 1
    },
    xaxis: {
        title: 'Date',
        titlefont: {
            family: 'Courier New, monospace',
            size: 18,
            color: '#7f7f7f'
        }
    },
    yaxis: {
        title: 'Sales',
        titlefont: {
            family: 'Courier New, monospace',
            size: 18,
            color: '#7f7f7f'
        }
    }
};

var options = {
    scrollZoom: true,
    showLink: false,
    modeBarButtonsToRemove: ['zoom2d', 'pan', 'pan2d', 'sendDataToCloud', 'hoverClosestCartesian', 'autoScale2d'],
    displaylogo: false,
    displayModeBar: true,
};

Plotly.newPlot('tester', data, layout, options);
plotly javascript
2 Answers

There's an easier way to do this in newer versions of Plotly (v1.38+). Use the toImageButtonOptions parameter in the config like this:

Plotly.newPlot(graphDiv, data, layout, {
    toImageButtonOptions: {
        filename: 'image_filename',
        width: 800,
        height: 600,
        format: 'png'
    }
});

You can leave out options you don't need to use the defaults.

user_3617660
Related