GR-PEACH グラフィックスモジュール (graphics)

graphics モジュールは、フレームバッファへのグラフィックスの描画を行います。

new Graphics(config)

グラフィックスの描画を行うフレームバッファの設定を行います。処理は同期で行われ、処理が完了するとGraphicsクラスのインスタンスを返却します。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;
var display = require('display');

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  /* グラフィックス描画... */

  /* グラフィックスをLCDに表示 */
  var lcd = display.openLCDSync({ type: '4.3inch' });
  lcd.startSync(0, graphics.frameBuffer, 'rgb565');
} catch (err) {
  console.log(err);
}

Graphicsクラス

フレームバッファへのグラフィックスの描画を行うクラスです。

本クラスで使用する色データは、new Graphics()config.formatで指定したフォーマットの1ピクセル当たりのデータをnumberで指定します。 各フォーマットに対して、色データの各ビットの対応関係は以下のようになります。

"rgb565"  : 0bRRRRRGGGGGGBBBBB
"argb4444" : 0bAAAARRRRGGGGBBBB
"rgb888"  : 0bXXXXXXXXRRRRRRRRGGGGGGGGBBBBBBBB(Xのビットの値は無効)
"argb8888" : 0bAAAAAAAARRRRRRRRGGGGGGGGBBBBBBBB

graphics.frameBuffer

graphics.bufferWidth

graphics.bufferHeight

graphics.bufferFormat

graphics.drawImage(image, x, y)

画像をフレームバッファに転送(コピー)します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

指定された各座標やサイズがフレームバッファのサイズを超える場合、サイズ内の範囲に切り詰められます。切り詰めた結果、転送する領域の横幅や高さが0以下となった場合は、転送を行わずに成功扱いで終了します。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;
var jpeg = require('jpeg');
var fs = require('fs');

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  var jpegData = fs.readFileSync('/sd/input.jpg');
  var buf = new AlignedBuffer(jpegData, 32);
  var image = jpeg.decodeSync(buf, {width:480, height:272, format:'rgb565'});
  graphics.drawImage(image, 0, 0);
} catch (err) {
  console.log(err);
}

graphics.drawLine(startX, startY, endX, endY, color)

フレームバッファに線を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0xFFFF, true); /* 背景を白で塗りつぶす */
  graphics.drawLine(0, 0, 480, 272, 0xF800); /* 赤の線を描画 */
} catch (err) {
  console.log(err);
}

graphics.drawRect(x, y, width, height, color, fill)

フレームバッファに矩形を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0xFFFF, true); /* 背景を白で塗りつぶす */
  graphics.drawRect(100, 100, 100, 100, 0x0000, false); /* 黒の矩形を描画 */
} catch (err) {
  console.log(err);
}

graphics.drawArc(centerX, centerY, radius, startAngle, endAngle, color)

フレームバッファに弧を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0xFFFF, true); /* 背景を白で塗りつぶす */
  graphics.drawArc(100, 100, 100, 0, 180, 0x07E0); /* 緑の半円を描画 */
} catch (err) {
  console.log(err);
}

graphics.drawCircle(centerX, centerY, radius, color, fill)

フレームバッファに円を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0xFFFF, true); /* 背景を白で塗りつぶす */
  graphics.drawCircle(100, 100, 100, 0x001F, true); /* 青の円を描画 */
} catch (err) {
  console.log(err);
}

graphics.drawEllipse(centerX, centerY, radiusX, radiusY, color, fill)

フレームバッファに楕円を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0xFFFF, true); /* 背景を白で塗りつぶす */
  graphics.drawEllipse(100, 100, 100, 50, 0x0000, true); /* 黒の楕円を描画 */
} catch (err) {
  console.log(err);
}

graphics.drawPolygon(centerX, centerY, radius, sides, color, fill)

フレームバッファに正多角形を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0x0000, true); /* 背景を黒で塗りつぶす */
  graphics.drawPolygon(100, 100, 100, 3, 0xFFFF, true); /* 白の三角形を描画 */
} catch (err) {
  console.log(err);
}

graphics.drawText(text, x, y, size, color, background)

フレームバッファに文字列を描画します。処理は同期で行われ、処理が完了すると呼び出し元に戻ります。失敗すると例外をスローします。

使用例

var Graphics = require('graphics').Graphics;
var AlignedBuffer = require('aligned_buffer').AlignedBuffer;

try {
  var buf = new AlignedBuffer(480 * 272 * 2, 32);
  var graphics = new Graphics({buf:buf, width:480, height:272, format:'rgb565'});
  graphics.drawRect(0, 0, 480, 272, 0xFFFF, true); /* 背景を白で塗りつぶす */
  graphics.drawText('Hello World!', 0, 0, 2, 0x0000, 0xFFFF);
} catch (err) {
  console.log(err);
}