3

Is there a way to detect the maximum width and height for canvas element? I'm trying to serve different image sizes depending on the user support for that tag

Edit: Here are more details...

I'm using Three.js with canvas renderer. When passing it a large texture some devices couldn't load them because the canvas size limit (iPhone 4 for example). But it fails silently so i can't do nothing to detect it and load a smaller texture. So i need a way to know what is the max size of the canvas element to load the proper file.

also tried to oversize it like this to catch an error

var backCanvas = document.createElement('canvas');
var img = $('img').get(0);
img.width= 90000;
backCanvas.getContext('2d').drawImage(img,0,0,90000,90000)
7daysofrain
  • 41
  • 7
  • What you had tried so far ? Please post your code via www.jsfiddle.net or codepen – Sulthan Allaudeen Mar 26 '14 at 12:03
  • Had you tried this link ??? http://stackoverflow.com/questions/10259108/what-is-the-maximum-size-for-an-html-canvas – Ravinder Singh Bhanwar Mar 26 '14 at 12:09
  • i dont think this is a problem with the int limit Because is happening with a small texture too in some devices (2048x2048) – 7daysofrain Mar 26 '14 at 12:28
  • It is well known that some implementation of the 2D canvas have a maximum size, esp. on the iOS devices. E.g. see http://stackoverflow.com/questions/6081483/maximum-size-of-a-canvas-element For my own application it would be really great to figure out the limits during runtime... – Chris May 29 '14 at 12:25

1 Answers1

0

Yes, but unfortunately not using a native browser API.

See my answer in the Maximum size of a <canvas> element thread for details.

John Hildenbiddle
  • 3,115
  • 2
  • 19
  • 14