Class enchant.Surface
canvas要素をラップしたクラス. enchant.Sprite や enchant.Map のimageプロパティに設定して表示させることができる. Canvas APIにアクセスしたいときは enchant.Surface#context プロパティを用いる.
- Defined in: enchant.js
- Extends enchant.EventTarget
| Constructor Attributes | Constructor Name and Description | 
|---|---|
| 
									enchant.Surface(width, height)
								 | 
| Field Attributes | Field Name and Description | 
|---|---|
| Surfaceの描画コンテクスト. | |
| Surfaceの高さ. | |
| Surfaceの横幅. | 
Method Summary
| Method Attributes | Method Name and Description | 
|---|---|
| clear()
										 Surfaceの全ピクセルをクリアし透明度0の黒に設定する. | |
| clone()
										 Surfaceを複製する. | |
| draw(image)
										 Surfaceに対して引数で指定されたSurfaceを描画する. | |
| getPixel(x, y)
										 Surfaceから1ピクセル取得する. | |
| <static> | enchant.Surface.load(src, callback, onerror)
										 画像ファイルを読み込んでSurfaceオブジェクトを作成する. | 
| setPixel(x, y, r, g, b, a)
										 Surfaceに1ピクセル設定する. | |
| SurfaceからdataスキームのURLを生成する. | 
- Methods borrowed from class enchant.EventTarget:
- addEventListener
- clearEventListener
- dispatchEvent
- on
- removeEventListener
Class Detail
						enchant.Surface(width, height)
					
					
					// 円を表示するSpriteを作成する var ball = new Sprite(50, 50); var surface = new Surface(50, 50); surface.context.beginPath(); surface.context.arc(25, 25, 25, 0, Math.PI*2, true); surface.context.fill(); ball.image = surface;
- Parameters:
- {Number} width
- Surfaceの横幅.
- {Number} height
- Surfaceの高さ.
Field Detail
							
							
							
							
							{CanvasRenderingContext2D}
							
							context							
						
						
						
							Surfaceの描画コンテクスト.
							
							
							
						
						
						
							
						
						
					
						
							
							
							
							
							{Number}
							
							height							
						
						
						
							Surfaceの高さ.
							
							
							
						
						
						
							
						
						
					
						
							
							
							
							
							{Number}
							
							width							
						
						
						
							Surfaceの横幅.
							
							
							
						
						
						
							
						
						
					
				Method Detail
- 
								clear()Surfaceの全ピクセルをクリアし透明度0の黒に設定する.
- 
								{enchant.Surface} clone()Surfaceを複製する.- Returns:
- {enchant.Surface} 複製されたSurface.
 
- 
								draw(image)Surfaceに対して引数で指定されたSurfaceを描画する. Canvas APIのdrawImageをラップしており, 描画する矩形を同様の形式で指定できる.var src = core.assets['src.gif']; var dst = new Surface(100, 100); dst.draw(src); // ソースを(0, 0)に描画 dst.draw(src, 50, 50); // ソースを(50, 50)に描画 // ソースを(50, 50)に縦横30ピクセル分だけ描画 dst.draw(src, 50, 50, 30, 30); // ソースの(10, 10)から縦横40ピクセルの領域を(50, 50)に縦横30ピクセルに縮小して描画 dst.draw(src, 10, 10, 40, 40, 50, 50, 30, 30); - Parameters:
- {enchant.Surface} image
- 描画に用いるSurface.
 
- 
								{Number[]} getPixel(x, y)Surfaceから1ピクセル取得する.- Parameters:
- {Number} x
- 取得するピクセルのx座標.
- {Number} y
- 取得するピクセルのy座標.
 - Returns:
- {Number[]} ピクセルの情報を[r, g, b, a]の形式で持つ配列.
 
- 
								
								
								画像ファイルを読み込んでSurfaceオブジェクトを作成する. このメソッドによって作成されたSurfaceはimg要素をラップしており enchant.Surface#context プロパティに アクセスしたり enchant.Surface#draw, enchant.Surface#clear, enchant.Surface#getPixel, enchant.Surface#setPixel メソッドなどの呼び出しでCanvas APIを使った画像操作を行うことはできない. ただしenchant.Surface#draw メソッドの引数とすることはでき, ほかのSurfaceに描画した上で画像操作を行うことはできる(クロスドメインでロードした 場合はピクセルを取得するなど画像操作の一部が制限される).- Parameters:
- {String} src
- ロードする画像ファイルのパス.
- {Function} callback
- ロード完了時のコールバック.
- {Function} onerror Optional
- ロード失敗時のコールバック.
 - Returns:
- {enchant.Surface} Surface
 
- 
								setPixel(x, y, r, g, b, a)Surfaceに1ピクセル設定する.- Parameters:
- {Number} x
- 設定するピクセルのx座標.
- {Number} y
- 設定するピクセルのy座標.
- {Number} r
- 設定するピクセルのrの値.
- {Number} g
- 設定するピクセルのgの値.
- {Number} b
- 設定するピクセルのbの値.
- {Number} a
- 設定するピクセルの透明度.
 
- 
								{String} toDataURL()SurfaceからdataスキームのURLを生成する.- Returns:
- {String} Surfaceを表すdataスキームのURL.