P5.js 日本語リファレンス(sphere)

このページでは[「P5.js 日本語リファレンス」] (https://qiita.com/bit0101/items/91818244dc26c767a0fe) の sphere関数を説明します。

sphere()

説明文

指定された半径で球を描画します。

detailX と detailY は、球のx方向とy方向の分割数を指定します。分割数を増やすと球がより滑らかに見えます。推奨される最大値は両方とも24です。24より大きい値を使用すると、警告が発生したりブラウザーの速度が低下したりする場合があります。

構文

sphere([radius], [detailX], [detailY])

パラメタ

• radius
  Number：円の半径(オプション、省略時は50)

• detailX
  Integer：x方向の分割数(オプション、省略時は24)

• detailY
  Integer：y方向の分割数(オプション、省略時は24)

例1

let detailX;
//スライダを動かして, x方向の分割数を増減します
function setup(){
  createCanvas(200, 200, WEBGL);

  // スライダの作成(最小値3、最大値24、デフォルト値3)
  detailX = createSlider(3, 24, 3);
  detailX.position(0, height + 5);
  detailX.style( 'width',  '200px');
}

function draw(){
  background(205, 105, 94); 
  rotateY(millis()/ 1000); // y軸回転
  // 球の描画(半径40、x方向の分割数はスライダ指定値、y方向の分割数は16
  sphere(40, detailX.value(), 16);

  console.log(detailX.value());
}

実行結果

著作権

p5.js was created by Lauren McCarthy and is developed by a community of collaborators, with support from the Processing Foundation and NYU ITP. Identity and graphic design by Jerel Johnson.

ライセンス

Creative Commons(CC BY-NC-SA 4.0) に従います。