canvas开发进阶

也不知道算是不算进阶。。。姑且放标题来吸引眼球吧

玩过canvas的都知道canvas的事件处理仅仅依存canvas，对内部的东西则不存在事件处理，那么我们该怎么办呢。。。。。。呢

微信小程序也支持canvas，好多人都想用canvas来做点东西，可是搞了半天除了图表就是图表，要么就是画板之类的东西，那么如何来对canvas内部的小东西来绑定事件监听呢

接下来是一串代码

    window.onload=function(){
        var canva=document.getElementById('canva');
        var ctx  =canva.getContext("2d");
        var h=canva.height;
        var w=canva.width;
        var rext={                            //随机坐标
            x:Math.random()*(w-50),
            y:Math.random()*(h-50),
        };
        (function Rect(){                       //画一个矩形，当然圆也可以
            ctx.fillStyle='whitesmoke';
            ctx.fillRect(rext.x,rext.y,50,50);
        })()    

------------


        接下来的可以自行封装起来留着以后用，我只是举个李子
        canva.addEventListener('mousemove',function(ev){   //鼠标滑过的处理
            var ev=ev||event;
            var x=ev.clientX;            
            var y=ev.clientY;                     
            //获取鼠标的信息，或者手指的动作信息也可以
            if(x>=rext.x && x<=rext.x+50 && y>=rext.y && y<=rext.y+50  )
            {        
                        console.log('选中');            //此处可进行具体的动作处理
                }
            })        
    }

该代码扣自我正在开发的插件中(默默的装了一波逼)，也许你会问为什么不写小程序版本的呢，又关这个问题嘛。。。。。。。。。。。。。。我还不会小程序呢，hhhhh
水了那么多，其实我是来挣积分的，有关移植到小程序的问题，谁有空可以来试一下.鄙人因为临近期末的缘故，所以要开始看书了
有关小程序的canvas开发，我之前有写过两篇话题，canvas新手可以去参考着那两章来尝试这一节的内容.不懂的欢迎提问.
此处打个广告—-诚邀canvas开发的各位大大，有兴趣的可以参与我的canvas插件的制作

楼下欢迎打赏点赞扔硬币