let element;
function initiate() {
  element = document.getElementById("canvas");
  let width = element.width;
  let height = element.height;
  element.addEventListener("click", copyImage);

  let canvas = element.getContext("2d");
  canvas.beginPath();
  canvas.arc(width / 2, height / 2, 100, 0, Math.PI * 2, false);
  canvas.clip();

  let image = document.createElement("img");
  image.src = "images/myimage.jpg";
  image.addEventListener("load", function() {
    canvas.drawImage(image, 0, 0, width, height);
  });
}
function copyImage() {
  let data = element.toDataURL();
  let databox = document.getElementById("databox");
  databox.innerHTML = '<img src="' + data + '">';
}
window.addEventListener("DOMContentLoaded", initiate);