Download heatmap plot as image in Internet Explorer

plotly.js
1

I am working on heatmap graph in this case i need to download heatmap graph.In chrome we could able to download heat map as a png file but not in Internet explorer (Showing following messge-‘Snapshotting is unavailable in Internet explorer. Consider exporting your images using the Plotly Cloud’).
I want to download heatmap graph as png file in Internet Explorer.
Please suggest the code or document or any working example

Thanks in advance

2

Upgrade to v1.11.0 or up and this should work in IE11.

Note that, the to image mode bar button will download an svg image in IE11 instead of a png like Chrome and FF.

3

Thanks for the reply,
Why IE not support PNG format? Any specific reason?

4

We are using the following algorithm:

  1. convert the svg ( + gl canvas for our WebGL trace types) graphs to a dataURL,
  2. paste that dataURL into a canvas node then
  3. use canvas.toDataURL('image/png'); to output a png (and similarly for jpg and webp images)

Our algorithm is very similar to the one put forward here.

IE11 does not allow to add client-side generated dataURL to <canvas> nodes (it lead to some corrupted canvas error) making step 2 fail.

Some workarounds exist (example), but implementing them in plotly.js would add a lot weight the library to support an outdated browser. So we chose to not to support to png exports in IE11.

For more info, see the full discussion in this PR here.

Though I haven’t tried, calling Plotly.toImage('graph', { format: 'svg' }) and then piping the result in canvg should allow for png export in IE11.