canvas画两个四边形的问题

Question

如图,我在一个canvas上画了两个四边形,这两个四边形都可以拉伸

现在是有两个需求:
1.这两个四边形都不可以拉成凹四边形;
2.小四边形要在大四边形范围之内;

我的思路是这样的:

A点是四边形要拖动的那个点,他的活动范围是如图的阴影部分
分别计算这三条线的斜率,使a点满足图中的不等式...
同理计算外面的大四边形斜率 ,a点只能在同时满足这些条件的范围内拉伸

不知道我想的是否可行,大神门有没有更好的办法求教~~~

Answer 1

1.对于这两个四边形自身,他们任意一点都不在其他三点组成的三角形区域内;//保证自身是不是凹四边形
2.拖动小四边形时,小四边形任意一点都必须在大四边形区域内;
3.拖动大四边形时,小四边形任意一点都必须在大四边形区域内;
满足这三个条件,就基本完成了楼主的需求.
关于判断点是否在区域内,参考了芋头大神的js代码:http://html-js.com/article/1185

Answer 2

你思路已经有了，自己找资料去实现就行了。如果想别人帮你实现好把代码贴出了的话，估计没什么人有这个时间

Answer 3

判断是否是凸边形？凸包吧

判断一个是否在另一个内？判断一个的每个点在另一个内就可以了

Answer 4

就是要判断一个点是否在一个多边形的内部，这里有的多个算法
其中一个算法推荐一下。判断以要判定的点的水平线和多边形边的交点的个数来判定
判定点2左右交点个数都是奇数，那么在内部，否则在外部
http://www.cnblogs.com/luxiaoxun/p/3722358.html
http://alienryderflex.com/polygon/

Answer 5

是不是內凹我覺得用三角函數會比較快，sin(A)＞0

Answer 6

判断是否是凹四边形，我提供一种思路：

检查四边形的两条对角线(段)是否有交点。有则是凸四边形，无则是凹四边形。