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

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

textWidth()

説明文

文字または文字列の幅(ピクセル単位)を計算して返します。

構文

textWidth(theText)

パラメタ

• theText
  String：計算する文字または文字列

戻り値

Number：文字または文字列の幅(ピクセル単位)

例1

function setup(){
  createCanvas(300, 300);

  textSize(14);

  let aChar = 'P';

  // テキストサイズ14の文字幅を取得します
  let cWidth = textWidth(aChar);
  
  text(aChar, 0, 40);
  
  // 取得したサイズの位置にラインを描画します
  line(cWidth, 0, cWidth, 50);

  let aString = 'p5.js';
  
  // テキストサイズ14の文字列幅を取得します
  let sWidth = textWidth(aString);
  
  text(aString, 0, 85);
  
  // 取得したサイズの位置にラインを描画します
  line(sWidth, 50, sWidth, 100);

  textSize(28);

  aChar = 'P';
  
  // テキストサイズ28の文字幅を取得します
  cWidth = textWidth(aChar);
  
  text(aChar, 100, 40);
  
  // 取得したサイズの位置にラインを描画します
  line(cWidth + 100, 0, cWidth + 100, 50);

  aString = 'p5.js';
  
  // テキストサイズ28の文字列幅を取得します
  sWidth = textWidth(aString);
  
  text(aString, 100, 85);
  
  // 取得したサイズの位置にラインを描画します
  line(sWidth + 100, 50, sWidth + 100, 100);
}

実行結果

著作権

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) に従います。