为了账号安全,请及时绑定邮箱和手机立即绑定

鼠标在Canvas页面点击,怎么确定点的位置是否在其中画的线上?在画的线上事触发事件?

鼠标在Canvas页面点击,怎么确定点的位置是否在其中画的线上?在画的线上事触发事件?

犯罪嫌疑人X 2018-11-28 17:14:58
下面这是三段划线的代码,当我自己进入编辑模式后;我点击鼠标左键时,已经记录出左键在vcanvas里的相应位置。我怎么判断我点击的点是否在我画的线段上?//这是划线 关键代码
查看完整描述

1 回答

?
繁华开满天机

TA贡献1816条经验 获得超4个赞

一般像这种你需要先给线段设定一个可以选取的范围(四个顶点的x,y),就跟写游戏一样。
然后通过获取canvas内的鼠标坐标来判断鼠标位于哪个对象的选取范围,这时你可以考虑用观察者模式来实现事件的绑定。
至于判断坐标是否在范围内的算法 可以用射线法(考虑到线段可能会旋转和缩放)来判定。

这个虽然我很想帮你,但我写好的源码在不久前把电脑硬盘摔坏后就没了。
我给你写下基本思路吧: 
1.首先设置范围就看评论里的例子,四个顶点设好了我们基本上就有了活动的区间,至于区间范围有多大看你个人需求。

2.“观察者模式”(发布-订阅者模式)可以网上搜一下基本代码,其实很容易懂的。

3.至于旋转后坐标的算法,点这里(注意这里是逆时针旋转的公式),直接套用就好。

4.射线法你可能需要用到 向量 来计算,请回忆下你的高中数学。

链接我都给你补好了,先慢慢学吧。看上去很烦,但懂了其实就很容易。


查看完整回答
反对 回复 2018-12-21
  • 1 回答
  • 0 关注
  • 2072 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号