Drawing Tool

Drag and Drop

Step 14: Position the image in the box when the user drags and drops it on the canvas.
Hint: Use a drop event listener.
Note: You cannot put elements directly in a <canvas> tag:
yourCanvasVariable.addEventListener(`drop`, drop);

function drop(event) {
  // get the mouse coordinates relative to the box
  let x = event.offsetX
  let y = event.offsetY

  // write code here to position the image in the box
}
Last step Next step