title: Use canvas drawImage to separate img into two halves
body: <p>I'm trying to split image in my canvas. <br><br>
  First I'm declaring canvas in HTML:</p>
  
  <pre><code>&lt;canvas width="600" height="400" id="canvas_1"&gt;
          Canvas tag not supported
  &lt;/canvas&gt;
  </code></pre>
  
  <p>Then I'm unsuccesfully spliting my image:</p>
  
  <pre><code>var canvas = document.getElementById("canvas_1");
  
  if (canvas.getContext){
     var canvas_context = canvas.getContext("2d");
     var img = document.getElementById("london_eye");
     canvas_context.drawImage(img, 0, 0, 230, 300, 20, 20, 80, 300);
     canvas_context.drawImage(img, 30, 0, 180, 300, 200, 20, 80, 300);
  }
  </code></pre>
  
  <p>I guess I'm missing something there..</p>
  
  <pre><code>canvas_context.drawImage(img, 0, 0, 230, 300, 20, 20, 80, 300);
  canvas_context.drawImage(img, 30, 0, 180, 300, 200, 20, 80, 300);
  </code></pre>
  
  <p><a href="https://jsfiddle.net/bimbochobot/fokzwyew/" rel="nofollow">FIDDLE</a><br>
  Thank you for your time and advices</p>