元Webデザイナー兼コーダーの備忘録

ウェブデザインやプログラミング、ブログのカスタマイズなどについてアウトプットしています。

 メニュー

» HTML入門のまとめはこちらです。

Processingにおけるベクトルの大きさ

The Nature of Code(PDF版)からPVectorについて取り上げます。その中でもベクトルの大きさについて書きます。Processingでプログラムを書いて、動作を確認します。動作を確認できるところがProcessingの楽しいところです。

ベクトルの大きさ

大きさと言っていますが、長さと言い換えても良いかもしれません。図形として捉える場合、その方がしっくりくると思います。

PVector a = new PVector(3, 4);
println(a.mag());  //5.0と出力される

プログラムの解説・メモ

ベクトルaは、a=(3, 4)という成分を持っているとします。このときのベクトルの長さは、5(三平方の定理より)です。

  • メモ
    • mag():ベクトルの大きさを返す

ベクトルの大きさの例

以下は、ベクトルの大きさの参考例です。

//Vector magnitude

void setup(){
  size(200, 200);
  smooth();
}

void draw(){
  background(255);

  PVector mouse = new PVector(mouseX, mouseY);
  PVector center = new PVector(width/2, height/2);
  mouse.sub(center);

  float m = mouse.mag();
  fill(0);
  rect(0, 0, m, 10);

  translate(width/2, height/2);
  line(0, 0, mouse.x, mouse.y);
}

マウスからウィンドウの中央までを直線で描画しています。そのベクトルの大きさを左上の長方形で描画しています。

まとめ

The Nature of Code(PDF版)からPVectorについて取り上げました。その中でもベクトルの大きさについて書きました。引き続き、The Nature of Code(PDF版)の内容を勉強します。

参考サイト

» HTML入門のまとめはこちらです。