浏览器鼠标手势原理简析

浏览器市场百家争鸣、百花齐放,每款浏览器都有自己的特色和亮点,但是基本功能都相差不大,其中一个比较通用的功能就是浏览器的鼠标手势,而且鼠标手势一般由8个中的两个或多个组成。例如淘宝浏览器的【回底部】是由组成,【刷新】是由组成。

鼠标手势在很多浏览器都有广泛使用,有浏览器自带的,可以直接使用,如360浏览器、sogou浏览器,也有需要用户安装扩展才能用的,如Chrome、Opera。鼠标手势之所以得到广大用户的亲睐,与其简单、作用范围广、功能常用有很大的关系。但是很少人知道鼠标手势的鼻祖是Opera浏览器。

那么鼠标手势是怎么实现的呢,从表现上看貌似很复杂,但是原理并不是想象的那么难。鼠标手势玩的就是算法,建立弧度向量表,根据鼠标轨迹的点计算方向,然后与预定义的鼠标手势进行对比,取出最相似的一组。这几个步骤当中都要用到不同的算法。首先是弧度向量表,以八个方向()的向量划分弧度,并按一定的精度建立一个弧度向量表。这还不够,在现实使用中,往往鼠标轨迹和定义的不是完全匹配,例如画直线可能会有点弯曲,斜向上的角度不一定正好是45度,当然这些问题都可以通过精度修正来解决,换句话说,就是允许有一定的误差。

VN:F [1.9.10_1130]

please wait...

Rating: 9.0/10 (2 votes cast)

浏览器鼠标手势原理简析, 9.0 out of 10 based on 2 ratings 转载务必注明出处Taobao QA Team,原文地址:http://qa.taobao.com/?p=15578
电脑维修,网站建设,软件开发立即联系立刻联系


我的各种联系方式:

楼主的博客   楼主的的论坛   楼主的的淘宝小店  

我的新浪微博

1.png   1.png  

我的腾讯微博

1.jpg   1.jpg  

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
代码一个多月没看,昨晚终于把错误找着了。这个演示程序能识别上下左右、西南、东南、正方形等,识别率很高。在线演示地址是ai-demo.appspot.com。 这个算法原理很好理解,好比老师让学生背诵课文,老师要达到的目的是“学生背过课文”,相对应的,软件要达到的目的是“我们把鼠标向左移动”显示“左”。老师第一次对学生说,你把课文背一遍,学生磕磕绊绊,老师说不通过接着告诉同学背课文的技巧等等,然后学生回到作为继续背课文。下节课,老师又对这个学生说,你把课文背一遍,学生背还是不很流畅,老师又说不通过,然后学生再回去背……,直到最后一次背课文,老师说OK,这就算达到目的了。 同样,软件识别鼠标手势也是一样,“鼠标向左移动手势”输入到算法中,程序检查算法计算结果,如算法输出果结果距离“左”差很远,那么不通过,程序就告诉算法,你要继续改进。如此循环,直到算法输出结果跟输入手势非常接近了,程序说通过了,那么就达到目的了,也就意味着这个算法就可以识别出“左”了!同样,也可以把“右”识别出来。 这个算法在神经网络中叫“有监督的训练方法”也叫“反向传播”。目前我对这个算法就这么些理解了。里边还有很多东西有待研究。但是,能把书中的例子改成 JavaScript版本,我就非常高兴了!有兴趣的也可以看看这本《游戏编程中的人工智能技术》,我自古讨厌数学,而且讨厌公式,而人工只能就需要数学,但这本书讲的确实非常好! 这个程序里边并没有训练方法,我只是把书中训练好的数据提取出来,直接输入到JavaScript写的神经网络里,这样一打开程序就能直接识别,否则还得训练,就现在javascript的执行效率,这不得到猴年马月去了! 程序用了一个js游戏库,名字叫jsgamesoup,里边的画图是HTML5语法的,在IE6下支持不太好,在IE8下运行也很顺畅。
VB实现鼠标手势,根据移动鼠标的方向让程序作出某种反应。我的实现思路:   鼠标移动,如果把这些点都用直线连起来,就会形成一条轨迹线,鼠标手势就和现实生活中的打手势是一样的,   只要分析鼠标的轨迹符合某种规律就完成设定的某些操作。如何去分析一条轨迹线呢,一次鼠标移动的点是非常多的,而且精度也是相差深远,所以我实现的是比较简单的鼠标手势。   我的思路是这样的:鼠标的水平移动方向只有两种情况左和右,垂直方向也只有两种情况上和下,当鼠标的移动   幅度大于10个像素(水平x或垂直y坐标和旧的坐标点相减的绝对值大于或等于10),则捕获这个点,分析和上一次捕获的坐标点的相对位置,如果x坐标的差值小于0则水平方向是向左移动(其他方向一样),由于每次鼠标移动的轨迹都不会很精确,所以我设定的是如果差值小于3个像素点,则认为是0没有移动,我现在分析这两个点,如果水平方向是向左移动,则记录为L,向右则记录为R,如果没有移动则记录为0,垂直方向是一样的,如果向上则记录为U,向下则记录为D,没有移动则记录为0。现在我可以用一个长度为2的字符串记录下这个坐标点的情况了,例如:LU表示水平方向是向左移动,垂直方向是向上移动,0D表示水平方向没有移动,垂直方向向下移动,把这个字符串保存到数组或者集合中。当鼠标释放的时候,已经捕捉了非常多的坐标点,我是比较简单的鼠标手势,精度要求也不高,所以我从这所有坐标点中只取四个点作分析,怎么取这四个点呢?假设变量nPos为坐标点的个数除以四,表示平均的间隔个数,第一个点取第一个,第二个点取第nPos个,第三个取第nPos*2个,第四个点取最后一个。   现在是分析这四个坐标点的时候了,把这四个坐标点连成一个字符串。以下是可能出现的情况:   R0R0R0:R0表示水平方向向右移动,垂直方向没有移动,四个都是R0,表示轨迹向右;   0U0U0U:0U表示水平方向没有移动,垂直方向向上移动,四个都是0U,表示轨迹向上;   R*U*L*D:这个表示向右移动再向上移动,再向左移动,再向下移动,可以认为是逆时针画圈,当然精度不是很高   但是足够用了(如果你要求不是很高)。   至于其他点,可以用同样的思想去分析。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值