Plotly.toImage not working in IE11

[ravidixit]

I am trying to load the graph as image in a separate image tag by following the example given here, As of now its working fine for Chrome, FireFox but when I try with IE 11 (Specific: 11.0.9600.18499) it fails to load the image in the image tag.

Reference link: https://plot.ly/javascript/static-image-export/#saving-as-png

Code I am using is given below

var d3 = Plotly.d3;
var img_jpg = d3.select('#jpg-export');

Plotly.plot(
'plotly_div',
data,
layout)
.then(
function(gd)
{
 Plotly.toImage(gd,{height:500,width:700})
    .then(
       function(url)
    {
         img_jpg.attr("src", url);
        return Plotly.toImage(gd,{format:'jpg',height:800,width:800});
    })
});

Same code is working for all the other browsers apart from IE 11, would like to know how can I resolve this issue.

Here is a sample fiddle on the same request to run the fiddle in chrome and then IE to spot the difference.

Thanks

[etpinard]

duplicate of #699

[ravidixit]

@etpinard can you please provide one example how this can be implemented looking at the link do I need to implement the canvas separately for IE 11.

[ravidixit]

@etpinard I have tried the solution mentioned in the links, the solution for me works in chrome and firefox but not in IE11 Given is the canvas solution I have implemented which so far works in all the browser apart from IE 11.

JSFiddle: https://jsfiddle.net/ravidixit/g45Lxk8e/

Thanks