blob: fb7beec45e49f9ef5f4450cccf8e6ad680b18a62 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
|
---
title: ImageData
slug: Web/API/ImageData
translation_of: Web/API/ImageData
---
<div>{{APIRef("Canvas API")}}</div>
<p><code><strong>ImageData</strong></code> 인터페이스는 {{HTMLElement("canvas")}} 엘리먼트 영역의 기저의 픽셀데이터를 나타냅니다{{domxref("ImageData.ImageData", "ImageData()")}}생성자나 canvas객체에 연결된 {{domxref("CanvasRenderingContext2D")}}객체의 {{domxref("CanvasRenderingContext2D.createImageData", "createImageData()")}}나 {{domxref("CanvasRenderingContext2D.getImageData", "getImageData()")}}메소드로 생성할 수 있습니다. <strong><font face="Courier New">ImageData</font></strong>는 {{domxref("CanvasRenderingContext2D.putImageData", "putImageData()")}}의 인자로 전달할 수 있으며, 이를 통해 canvas의 일부로 반영할 수 있습니다.</p>
<h2 id="Constructors">Constructors</h2>
<dl>
<dt>{{domxref("ImageData.ImageData", "ImageData()")}} {{experimental_inline}}</dt>
<dd>인자로 주어진 {{jsxref("Uint8ClampedArray")}}로 부터 해당 크기에 맞는 ImageData객체를 생성합니다. 만약 인자가 주어지지 않으면 검정색 사각형 이미지를 생성합니다. {{domxref("CanvasRenderingContext2D.createImageData", "createImageData()")}}는 worker에서 사용할 수 없기 때문에, ImageData의 생성자를 이용하는 것이 가장 일반적인 방법입니다.</dd>
</dl>
<h2 id="Properties">Properties</h2>
<dl>
<dt>{{domxref("ImageData.data")}} {{readonlyInline}}</dt>
<dd>{{jsxref("Uint8ClampedArray")}}형식이며 1차원 배열로 RGBA순서로 정의된 이미지 데이터를 나타내니다. 각 원소는 정수값으로 0에서 255사이의 값을 갖습니다.</dd>
<dt>{{domxref("ImageData.height")}} {{readonlyInline}}</dt>
<dd>unsigned long형식으로 ImageData의 pixel기준의 실제 높이값입니다.</dd>
<dt>{{domxref("ImageData.width")}} {{readonlyInline}}</dt>
<dd>unsigned long형식으로 ImageData의 pixel기준의 실제 가로값입니다.</dd>
</dl>
<h2 id="Specifications" name="Specifications">Specifications</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('HTML WHATWG', "the-canvas-element.html#imagedata", "ImageData")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>4.0</td>
<td>{{CompatGeckoDesktop("14")}}</td>
<td>9.0</td>
<td>9.0</td>
<td>3.1</td>
</tr>
<tr>
<td>Support in workers</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop("25")}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td><code>ImageData()</code> constructor</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop("29")}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>2.1</td>
<td>{{CompatGeckoMobile("14")}}</td>
<td>{{CompatUnknown}}</td>
<td>10.0</td>
<td>3.2</td>
</tr>
<tr>
<td>Support in workers</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("25")}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td><code>ImageData()</code> constructor</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("29")}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="See_also">See also</h2>
<ul>
<li>{{domxref("CanvasRenderingContext2D")}}</li>
<li>The {{HTMLElement("canvas")}} element and its associated interface, {{domxref("HTMLCanvasElement")}}.</li>
</ul>
|