title: Save canvas with image with points to folder
body: <p>In a canvas I attach an image, after a click on it a point is drawn to the image and on double click the point is removed. My ultimate goal is to save the image with the points to a folder. Unfortunately only the points are saved in the folder without the image.</p>
  
  <p>How can I fix my codes to save both points and image to the folder ?</p>
  
  <pre><code>I- My code to save to the folder
  
  // send to controller
   $('#save').on('click', function() {
    var canvasData1 = canvas.toDataURL("image/png");
   $.ajax({
  type: "POST",
  url: "&lt;?=base_url('admin_medico/SaveCanvas')?&gt;",
  data: {canvasData1 :canvasData1}
     });
  
      });
  
  
  //Controller
  
   $file2 = $upload_dir ."fondo-". time() . ".png";
  $data2 = $_POST['canvasData1'];
  $data2 = substr($data2,strpos($data2,",")+1);
  $data2 = base64_decode($data2);
  file_put_contents($file2, $data2);
  </code></pre>
  
  <p>2- codes to draw the point on click and remove the point on double click are <a href="http://jsfiddle.net/xpvt214o/830391/" rel="nofollow noreferrer">in this fiddle:</a></p>