Detection on clicking bezier path shape with HTML5

To detect Bezier path shape on click, try the following code −

Example

var l = boxes.length;
for (var i = l-1; i >= 0; i--) {
   drawshape(gctx, boxes[i], 'black', 'black');
   var imgData = gctx.getImageData(mx, my, 1, 1);
   var index = (mx + my * imgData.width) * 4;
   if (imgData.data[3] > 0) {
      mySel = boxes[i];
      offsetx = mx - mySel.x;
      offsety = my - mySel.y;
      mySel.x = mx - offsetx;
      mySel.y = my - offsety;
      isDrag = true;
      canvas.onmousemove = myMove;
      invalidate();
      clear(gctx);
      return;
   }
}