curve

def setup
  background(220)
  noFill
  stroke(255, 102, 0)
  curve(5, 26, 5, 26, 73, 24, 73, 61)
  stroke(0)
  curve(5, 26, 73, 24, 73, 61, 15, 65)
  stroke(255, 102, 0)
  curve(73, 24, 73, 61, 15, 65, 15, 65)
end

def setup
  background(220)
  p1 = { x:  5, y: 26 }
  p2 = { x: 73, y: 24 }
  p3 = { x: 73, y: 61 }
  p4 = { x: 15, y: 65 }
  noFill
  stroke(255, 102, 0)
  curve(p1[:x], p1[:y], p1[:x], p1[:y], p2[:x], p2[:y], p3[:x], p3[:y])
  stroke(0)
  curve(p1[:x], p1[:y], p2[:x], p2[:y], p3[:x], p3[:y], p4[:x], p4[:y])
  stroke(255, 102, 0)
  curve(p2[:x], p2[:y], p3[:x], p3[:y], p4[:x], p4[:y], p4[:x], p4[:y])
end

def setup
  background(220)
  noFill
  stroke(255, 102, 0)
  curve(5, 26, 0, 5, 26, 0, 73, 24, 0, 73, 61, 0)
  stroke(0)
  curve(5, 26, 0, 73, 24, 0, 73, 61, 0, 15, 65, 0)
  stroke(255, 102, 0)
  curve(73, 24, 0, 73, 61, 0, 15, 65, 0, 15, 65, 0)
end

p5.jsリファレンス(参考情報)

[p5.js] curve

概要

曲線を描画します。

書式

curve(x1, y1, x2, y2, x3, y3, x4, y4)
curve(x1, y1, z1, x2, y2, z2, x3, y3, z3, x4, y4, z4)

引数

引数名内容備考オプションデフォルト値
x1制御点1の x座標
y1制御点1の y座標
x2描画基点の x座標
y2描画基点の y座標
x2描画終点の x座標
y2描画終点の y座標
x4制御点2の x座標
y4制御点2の y座標
z1制御点1の z座標WEBGLモードのキャンバスでのみ有効
z2描画基点の z座標WEBGLモードのキャンバスでのみ有効
z3描画終点の z座標WEBGLモードのキャンバスでのみ有効
z4制御点2の z座標WEBGLモードのキャンバスでのみ有効

戻値

なし

備考

関連