title: HTML5 Canvas eraser tool without overdraw white color
body: <p>I have canvas. I have paint tools pencil and eraser. How i can erase drawings without overwrite(overdraw) with white color. </p>
  
  <p>this my code eraser over drawing with white color:
  <a href="http://jsfiddle.net/66z12xb0/" rel="noreferrer">http://jsfiddle.net/66z12xb0/</a></p>
  
  <p>I have in back end save image after drawing.</p>
  
  <pre><code>&lt;?php
  $images = scandir(ROOT_FS . FINISH_DRAW_PATH, 1);
  $imageData = $GLOBALS['HTTP_RAW_POST_DATA'];
  $filteredData = substr($imageData, strpos($imageData, ",") + 1);
  $unencodedData = base64_decode($filteredData);
  
  $fileName = "photo.png"; 
  $fp = fopen(ROOT_FS .  SAVE_DRAW_PATH . $fileName, 'wb');
  fwrite($fp, $unencodedData);
  fclose($fp);
  ?&gt;
  </code></pre>
  
  <p>Open with windows photo viewer and see this result:</p>
  
  <p><img src="https://i.stack.imgur.com/Pa8Rf.png" alt="enter image description here">
  <img src="https://i.stack.imgur.com/sJZT2.png" alt="enter image description here"></p>
  
  <p>additional upload foto:</p>
  
  <pre><code>$("#upload_foto").click(function() {
      var data = canvas.toDataURL('image/png'); 
      var ajax = new XMLHttpRequest();
      ajax.open('POST', 'backend.php', false);
      ajax.setRequestHeader('Content-Type', 'application/upload');
      ajax.send(data);
  }); 
  
  &lt;button type='button' id='upload_foto'&gt;Upload&lt;/button&gt;
  </code></pre>