シェイプには塗りと枠線を設定できます。塗りだけを設定したり、線だけを描いて塗らないということも可能です。
塗り
塗りというのは図形に囲まれた領域となります。beginFill()
メソッドで塗りの色を指定します。
書式
Graphicsオブジェクト.beginFill(塗りの色);
Graphicsオブジェクト.endFill();
サンプル
// シェイプを作成
var shape = new createjs.Shape();
// 塗りの色を指定
shape.graphics.beginFill("DarkRed");
// 円を描く
shape.graphics.drawCircle(0, 0, 80);
※詳しい使い方は「公式ドキュメント(英語)」を確認ください。
コラム
図形を描いたらendFill()
メソッドで描き終わったことを指定します。必ずしも使わなくても大丈夫ですが、複数のシェイプを描くときには指定しておくほうが無難でしょう。
線
線とは図形の境界線のことです。setStrokeStyle()
メソッドで線の太さを、beginStroke()
メソッドで線の色を設定することができます。
書式
Graphicsオブジェクト.beginFill(塗りの色);
Graphicsオブジェクト.setStrokeStyle(線の太さ);
サンプル
// シェイプを作成
var shape = new createjs.Shape();
// 線の色を指定
shape.graphics.beginStroke("DarkRed");
// 線の幅を指定
shape.graphics.setStrokeStyle(5);
// 円を描く
shape.graphics.drawCircle(0, 0, 80);
※詳しい使い方は「 公式ドキュメント(英語)」のbeginStroke()とsetStrokeStyle()を確認ください。
コラム
図形を描いたらendStroke()
メソッドで描き終わったことを指定します。必ずしも使わなくても大丈夫ですが、複数のシェイプを描くときには指定しておくほうが無難でしょう。