title: Canvas drawImage size error
body: <p>I’m using two html canvas, the fronendCanvas is visible to the users and is part of the html DOM tree and is set to have 100% of the window width and height, the backendCanvas is created on the javascript code and is used to contain the huge diagram that I need to draw.</p>
  
  <pre><code>/** FrontendCanvas */
  // HTML
  &lt;canvas id="canvas"&gt;&lt;/canvas&gt; 
  
  // JavaScript
  frontCanvas.width = window.innerWidth;
  frontCanvas.height = window.innerHeight;
  
  // CSS
  #canvas {
     display: block;
     background-color: #dddddd;
  }
  
  /** BackendCanvas */
  // JavaScript
  backCanvas = document.createElement('canvas');
  backCanvas.width = diagram.maxX;
  backCanvas.height = diagram.maxY;
  </code></pre>
  
  <p>Basically, to have a smooth visualisation the frontendCanvas only shows a part of the huge image drawn in the backendCanvas using the drawImage function (user can use the mouse to drag the visualisation area across the diagram, see the example <a href="https://stackoverflow.com/questions/18057857/move-html5-canvas-with-a-background-image">Move HTML5 Canvas with a background image</a>).</p>
  
  <pre><code>frontCanvas.getContext('2d').drawImage(
      backCanvas,
      (-ix - offsetX),
      (-iy - offsetY),
      (frontCanvas.width),
      (frontCanvas.height),
      0,
      0,
      (frontCanvas.width),
      (frontCanvas.height)
  );
  </code></pre>
  
  <p>When I set the backendCanvas width and height to 15000 everything works fine, but when I set it to the size that I actually need, width 62322 and height 50946, somehow the drawImage doesn’t work any more and throws the size error:</p>
  
  <pre><code>IndexSizeError: Index or size is negative or greater than the allowed amount
  (frontCanvas.height)
  </code></pre>
  
  <p>My guess would be that I’m reaching the maximum size of the canvas and it’s reseted, but it doesn’t seem the case because:</p>
  
  <ol>
  <li><p>the canvas reference says that the canvas width and height limit is an unsigned long, therefore much bigger than the numbers that I mentioned;</p></li>
  <li><p>I checked the size of the backendCanvas right before the drawImage function call and it is correct.</p></li>
  </ol>
  
  <p>Any help would be very much appreciated!</p>
  
  <p>Thanks.</p>