canvas监听画布上的内容被点击（仅仅适用于，画图上的内容较少（因为需要遍历）

canvas监听画布上的内容被点击（仅仅适用于，画图上的内容较少（因为需要遍历）

var cannvas=document.getElementById("cannvas");
var contenxt =cannvas.getContext("2d");

一、获取鼠标停留在画布上的区域

var x = event.clientX - cannvas.getBoundingClientRect().left;//鼠标在当前画布上的位置
var y = event.clientY - cannvas.getBoundingClientRect().top;

二、通过canvas画布添加监听事件（我这里面监听的是鼠标抬起，自取其他方式）

cannvas.addEventListener("mouseup",detect);

鼠标抬起，触发函数detect，在这个函数里面去遍历 所有画内要要被监听的元素。使用isPointInPath，判断停留的点是否在元素内部，触发

function detect(event){
    console.log("鼠标被提起了");
    var x = event.clientX - cannvas.getBoundingClientRect().left;//鼠标在当前画布上的位置
    var y = event.clientY - cannvas.getBoundingClientRect().top;

    for (var i=0; i