通常的前端开发业务中用算法的场景比拟少,用算法比拟多的场景往往是H5游戏和流动页比拟多。
上面分享开发场景中的算法利用。
旋转
先思考一下,下图中的旋转如何实现 ?
手机扫码体验
体验链接: http://auto.163.com/special/h...
=========================================================
难点是如何简便的判断出手指拖动转化成旋转的角度与方向
比拟好的方法应用 向量积
先温习数学上的向量积的常识
模长:(在这里示意两向量之间的夹角(共终点的前提下)(0°≤≤180°),它位于这两个矢量所定义的立体上。)
方向:a向量与b向量的向量积的方向与这两个向量所在立体垂直,且恪守右手定则。(一个简略的确定满足“右手定则”的后果向量的方向的办法是这样的:若坐标系是满足右手定则的,当右手的四指从a以不超过180度的转角转向b时,竖起的大拇指指向是c的方向。)
假如 a 向量的坐标为(ax, ay, ax),b 向量的坐标为 (bx, by, bz),i,j,k的值为1。向量的z值为0。也就是向量只在x,y立体。
下面的公式能够化简为 a x b = axby - aybx
上图中a地位坐标(1, 2, 0) b地位坐标(2, 1, 0),也就是ab 都在xy立体内。
当向量从a地位旋转到b地位,依据下面的公式计算的后果为-3;
当向量从b地位旋转到a地位,依据下面的公式计算的后果为3;
所以咱们能够依据后果值的正负来判断方向,依据算出的正玄值来得出旋转的角度。