_ScalableGraphics.js |
イメージ、シェイプ、文字列の描画をスケーラブルに行う機能を提供するクラス _ScalableGraphics が定義されています。
_USE_DRAWSTRINGEX | HTML5 Canvas テキストAPIをサポートしていない場合に <span> 要素を使用します。 |
コンストラクタ |
_ScalableGraphics |
_ScalableGraphics()
_ScalableGraphics コンストラクタです。
メソッド |
canUseClip |
canUseClip()
クリッピングをサポートしているかどうかチェックします。
戻り値:
クリッピングをサポートしている場合 true、サポートしていない場合 false
canUseText |
canUseText()
HTML5 Canvas テキストAPIをサポートしているかどうかチェックします。
戻り値:
HTML5 Canvas テキストAPIをサポートしている場合 true、サポートしていない場合 false
setScale |
setScale(scale)
拡大率を設定します。
scale | 拡大率を指定します。1.0 で等倍になります。 |
scale |
scale()
拡大率を取得します。
戻り値:
拡大率を返します。
getColorOfRGB |
getColorOfRGB(r,g,b)
RGB値を指定してそのRGB値に対応するカラーを表す文字列を取得します。
r | 赤要素の輝度を指定します(0〜255)。 |
g | 緑要素の輝度を指定します(0〜255)。 |
b | 青要素の輝度を指定します(0〜255)。 |
戻り値:
カラーを表す文字列を返します。
setStrokeWidth |
setStrokeWidth(width)
拡大前での線幅を設定します。
width | 拡大前での線幅を指定します。 |
setColor |
setColor(color)
描画に使用する色を設定します。
color | 描画に使用する色を指定します。 |
setAlpha |
setAlpha(a)
描画で参照されるα値を設定します。
a | α値を指定します(0〜255)。 |
補足説明:
α値とは、255 で不透明、0 で完全な透明になる値です。
setROP |
setROP(mode)
ラスタオペレーションを設定します。
mode | ラスタオペレーションを指定します。次のいずれかを指定します。
|
setFont |
setFont(size,family)
文字列描画に使用するフォントを設定します。
size | 拡大前でのフォントサイズを指定します。 |
family | フォントファミリー名 |
stringWidth |
stringWidth(str)
指定した文字列の、拡大前での幅を取得します。
str | 文字列を指定します。 |
戻り値:
文字列を表示するのに必要な幅の、拡大前での値を返します。
補足説明:
本処理呼び出しの前に、setFont() メソッドでフォントを設定しておく必要があります。
DoJaでの Font クラスの stringWidth() メソッドに相当する機能です。
fontHeight |
fontHeight()
フォントの拡大前での高さを取得します。
戻り値:
フォントの拡大前での高さを返します。
補足説明:
DoJaでの Font クラスの getHeight() メソッドに相当する機能です。
clearClip |
clearClip()
現在設定されているクリッピング領域を解除します。
setClip |
setClip(x,y,width,height)
引数によって指定された矩形をクリッピング領域として設定します。
x | 拡大前での、新しいクリッピング領域の左上のX座標を指定します。 |
y | 拡大前での、新しいクリッピング領域の左上のY座標を指定します。 |
width | 拡大前での、新しいクリッピング領域の幅を指定します。 |
height | 拡大前での、新しいクリッピング領域の高さを指定します。 |
drawLine |
drawLine(x1,y1,x2,y2)
直線を描画します。
x1 | 拡大前での、直線の描画開始点のX座標を指定します。 |
y1 | 拡大前での、直線の描画開始点のY座標を指定します。 |
x2 | 拡大前での、直線の描画終了点のX座標を指定します。 |
y2 | 拡大前での、直線の描画終了点のY座標を指定します。 |
drawRect |
drawRect(x,y,width,height)
矩形を描画します。
x | 拡大前での、矩形の左上のX座標を指定します。 |
y | 拡大前での、矩形の左上のY座標を指定します。 |
width | 拡大前での、矩形の幅を指定します。 |
height | 拡大前での、矩形の高さを指定します。 |
fillRect |
fillRect(x,y,width,height)
矩形領域を塗りつぶします。
x | 拡大前での、矩形の左上のX座標を指定します。 |
y | 拡大前での、矩形の左上のY座標を指定します。 |
width | 拡大前での、矩形の幅を指定します。 |
height | 拡大前での、矩形の高さを指定します。 |
drawString |
drawString(str,x,y)
文字列を描画します。
str | 描画する文字列を指定します。 |
x | 拡大前でのX座標を指定します。 |
y | 拡大前でのY座標を指定します。ベースラインの座標を指定します。 |
setFlipMode |
setFlipMode(flip)
イメージの描画時に反転または回転して描画を行うかどうかを設定します。
flip | イメージの描画時の反転または回転方法を指定します。次のいずれかを指定します。
|
drawImage |
drawImage(image,x,y)
イメージを描画します。
image | <img> 要素または Image オブジェクト |
x | 拡大前でのX座標を指定します。 |
y | 拡大前でのY座標を指定します。 |
drawScaledImage |
drawScaledImage(image,dx,dy,width,height,sx,sy,swidth,sheight)
イメージを拡大・縮小して描画します。
image | <img> 要素または Image オブジェクト |
dx | 拡大前での、描画先の矩形の左上のX座標を指定します。 |
dy | 拡大前での、描画先の矩形の左上のY座標を指定します。 |
width | 拡大前での、描画先の矩形の幅を指定します。 |
height | 拡大前での、描画先の矩形の高さを指定します。 |
sx | 描画元の矩形の左上のX座標を指定します。 |
sy | 描画元の矩形の左上のY座標を指定します。 |
swidth | 描画元の矩形の幅を指定します。 |
sheight | 描画元の矩形の高さを指定します。 |
drawTransImage |
drawTransImage(image,dx,dy,sx,sy,width,height,cx,cy,r360,z128x,z128y)
イメージを回転・拡大・縮小して描画します。
image | <img> 要素または Image オブジェクト |
dx | 拡大前での、描画先のアンカーX座標を指定します。アンカー座標とは、回転・拡大・縮小の基準となる座標です。 |
dy | 拡大前での、描画先のアンカーY座標を指定します。アンカー座標とは、回転・拡大・縮小の基準となる座標です。 |
sx | 描画元の矩形の左上のX座標を指定します。 |
sy | 描画元の矩形の左上のY座標を指定します。 |
width | 描画元の矩形の幅を指定します。 |
height | 描画元の矩形の高さを指定します。 |
cx | 描画元の矩形の左からの相対X座標を指定します。この座標点とアンカー座標が一致するように描画されます。 |
cy | 描画元の矩形の上からの相対Y座標を指定します。この座標点とアンカー座標が一致するように描画されます。 |
r360 | 回転角度を指定します。時計回りで、単位は「度」です。 |
z128x | X方向の拡大率を指定します。128 で拡大率100%(等倍)です。 |
z128y | Y方向の拡大率を指定します。128 で拡大率100%(等倍)です。 |
補足説明:
本メソッドは setFlipMode() メソッドの設定を見ません。反転は、z128x および z128y の値をマイナス値にすることで行うことができます。