EDGE cant copy large images using JS in to a canvas?

Question

I have this code, with copy parts from the image "smoothchartshowAnalisysCopy" (500px X 250px) in to the large one "analysisFullGraph1" (32172px X 250px).

And it is working well for IE, firefox, chrome, safari e vivaldi, but not that OK for Edge...

Edge, only can copy for the begin of the large image... maybe the max possition of 14000px...

var c   = document.getElementById('analysisFullGraph1'); 32172px X 250px
var ctx = c.getContext('2d');

var imageNow = document.querySelector('#smoothchartshowAnalisysCopy');
var ctxImageNow = imageNow.getContext('2d');


function copy(){
    var elmnt  = document.querySelector('#analysisFullGraphContainer1');
    var x = elmnt.scrollLeft;
    var y = elmnt.scrollTop;
    var imgData = ctx.getImageData(x, 0, 828, 270);
    ctxImageNow.putImageData(imgData, 0, 0);

}

I cant find info on Microsoft DOCs, not even in google..

I appreciate any help ou tips!

my edge is "Microsoft Edge 25.10586.0.0" and "Microsoft EdgeHTML 13.10586" — Roberval Sena 山本, Sep 02 '16 at 04:48
sorry, I googled and found that my first question was irrelevant — Jaromanda X, Sep 02 '16 at 04:49

score 2 · Accepted Answer · answered Sep 02 '16 at 04:35

The maximum size of the rendered area on a canvas is from 0,0 to 8192 x 8192 pixels, regardless of the size of the canvas. For example, a canvas is created with a width and height of 8292 pixels. A rectangular fill is then applied as "ctx.fillRect (0,0, canvas.width, canvas.height)".Only the area within the coordinates (0, 0, 8192, 8192) can be rendered, leaving a 100 pixel border on the right and bottom of the canvas. link

I searched for microsoft edge canvas size limit - it was the second link

EDGE cant copy large images using JS in to a canvas?

1 Answers1