如何使用KineticJS从一个圆圈到另一个圆圈创建箭头？

Question

如何使用KinectJS从一个圆圈到另一个圆圈创建箭头？

我有2个圆圈，半径= r，冲程= 1。如何做一个平滑的圆形箭头，或者只是从一个到另一个的路径？

感谢

Answer 1

如果你只想要一个简单的行，你可以使用

 Kinetic.Line({
        points: [circle1.getX(), circle1.getY(), circle2.getX(), circle2.getY()],
        stroke: 'red',
        strokeWidth: 15,
        lineCap: 'round',
        lineJoin: 'round'
 });

可以使用Kinetic.Spline（）

创建曲线

  var spline = new Kinetic.Spline({
    points: [{
      x: circle1.getX(),
      y: circle1.getY()
    }, {
      x: (circle1.getX()+circle2.getX())/2, 
      y: (circle1.getY()+circle2.getX())/2 +50   // modify this 50 to something that makes it round
    }, {
      x: circle2.getX(),
      y: circle2.getY()
    }],
    stroke: 'red',
    strokeWidth: 2,
    lineCap: 'round',
    tension: 1
  });