Canvas中如何让一个图标沿着路径运动

如图所示,已知A点和B点的坐标,我想让图中的小箭头从A点缓动到B点,并且箭头头部的角度与路径的角度保持一致,请问应该怎么处理这种场景呢?
图片描述

阅读 5.8k
2 个回答

路径用贝塞尔曲线绘制
根据贝塞尔曲线求t时刻的坐标
let begin = [x,y]
let control = [x1,y1]
let end = [x2,y2]
let x = Math.pow((1 - t) ,2) begin[0] + 2 t (1 - t) control[0] + Math.pow(t ,2) * end[0];
let y = Math.pow((1 - t) ,2) begin[1] + 2 t (1 - t) control[1] + Math.pow(t , 2) * end[1];
方向则为t时刻到t+k时刻的两点连线

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题