正弦波UIBezier 2点間のパス

Question

2点間で正弦波の経路を作成するにはどうすればよいですか？

原点から正弦波のパスを作成できますが、正弦波が目標CGPointで終わるように方向を変換する方法がわかりません。

Iは、それらの間の距離によってスケーリング、これについて考えるための最も簡単な方法は、2つの点の間の角度だけ回転する座標系を変換することであるSKAction.followPath

Answer 1

を使用して経路に沿っSKNodeをアニメートしたいと最初の点で平行移動します（サインが0,0で始まると仮定します）。

オペレータは、カーブを描きたいだけではなく（その場合は、グラフィックスコンテキストに変換を適用するだけです）、SpriteKit SKAction.followPath呼び出しでカーブを使用するよう指定しています。変換はパス内の座標に適用され、コンテキストには適用されません。

ここではUIBezierPathではなくCGPathを使用していますが、同等ですが、let uip = UIBezierPath(cgPath: path)で簡単にUIバージョンを取得できます。 （私は彼らがクロスプラットフォームであるのでCoreGraphicsを好む）。

遊び場コード...

class MyView: UIView { 

    override func draw(_ rect: CGRect) { 
     guard let context = UIGraphicsGetCurrentContext() else { return } 

     context.setFillColor(UIColor.red.cgColor) 
     context.fill(self.bounds) 

     // Calculate the transform 
     let p1 = CGPoint(x: 100, y: 100) 
     let p2 = CGPoint(x: 400, y: 400) 
     let dx = p2.x - p1.x 
     let dy = p2.y - p1.y 
     let d = sqrt(dx * dx + dy * dy) 
     let a = atan2(dy, dx) 
     let cosa = cos(a) // Calculate only once... 
     let sina = sin(a) // Ditto 

     // Initialise our path 
     let path = CGMutablePath() 
     path.move(to: p1) 

     // Plot a parametric function with 100 points 
     let nPoints = 100 
     for t in 0 ... nPoints { 
      // Calculate the un-transformed x,y 
      let tx = CGFloat(t)/CGFloat(nPoints) // 0 ... 1 
      let ty = 0.1 * sin(tx * 2 * CGFloat.pi) // 0 ... 2π, arbitrary amplitude 
      // Apply the transform 
      let x = p1.x + d * (tx * cosa - ty * sina) 
      let y = p1.y + d * (tx * sina + ty * cosa) 
      // Add the transformed point to the path 
      path.addLine(to: CGPoint(x: x, y: y)) 
     } 

     // Draw the path 
     context.setStrokeColor(UIColor.blue.cgColor) 
     context.addPath(path) 
     context.strokePath() 
    } 
} 

let v = MyView(frame: CGRect(origin: CGPoint(x: 0, y:0), size: CGSize(width: 500, height: 500))) 

Answer 2

ないあなたが何をしたい透き通ったが、ここであなたが傾斜罪曲線をしたいと仮定すると一つの可能​​性があります：

は（開始点であると仮定0、0）であり、終点は（x、y）である。

レッツLを原点とあなたのポイントとの間の距離である：L = SQRT（X^2 + y^2）

インクリメントDLおよびランニング和0で開始し、Lで終了するループを書きますl（0とLの間で実行される）。このループにより、ベジェのポイントを作成することができます。その後

Xになりますあなたの罪のグラフの座標：0からLまでの範囲 x_P =のL * COS（シータ）、* COS（シータ）= X

y座標を取得するために、我々は追加sin = 2 * sin * sin（2 * PI * 1/L）

注意：l = Lで、 x_P、y_P）=（x、y）となる。

これはあなたが望むものでしたか？これは回転ではないので、角度θが大きいときには動作しません。