aboutsummaryrefslogtreecommitdiff
path: root/files/pl/web/api/htmlcanvaselement/getcontext/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/pl/web/api/htmlcanvaselement/getcontext/index.html')
-rw-r--r--files/pl/web/api/htmlcanvaselement/getcontext/index.html129
1 files changed, 129 insertions, 0 deletions
diff --git a/files/pl/web/api/htmlcanvaselement/getcontext/index.html b/files/pl/web/api/htmlcanvaselement/getcontext/index.html
new file mode 100644
index 0000000000..e60fddc51e
--- /dev/null
+++ b/files/pl/web/api/htmlcanvaselement/getcontext/index.html
@@ -0,0 +1,129 @@
+---
+title: HTMLCanvasElement.getContext()
+slug: Web/API/HTMLCanvasElement/getContext
+translation_of: Web/API/HTMLCanvasElement/getContext
+---
+<div>{{APIRef("Canvas API")}}</div>
+
+<p class="summary">Metoda <strong><code>HTMLCanvasElement.getContext()</code></strong> zwraca kontekst pola roboczego {{HTMLElement("canvas")}}, lub {{jsxref("null")}} jeśli  identyfikator kontekstu nie jest wspierany.</p>
+
+<h2 id="Składnia">Składnia</h2>
+
+<pre class="syntaxbox">var <em>ctx</em> = <em>canvas</em>.getContext(<em>contextType</em>);
+var <em>ctx</em> = <em>canvas</em>.getContext(<em>contextType</em>, <em>contextAttributes</em>);
+</pre>
+
+<h3 id="Parametry">Parametry</h3>
+
+<dl>
+ <dt><code><em>contextType</em></code></dt>
+ <dd>Jest nim {{domxref("DOMString")}} zawierający identyfikator kontekstu pola roboczego powiązanego z {{HTMLElement("canvas")}}. Możliwe wartości to:
+ <ul>
+ <li><code>"2d"</code>,  tworzy obiekt {{domxref("CanvasRenderingContext2D")}} reprezentujący dwuwymiarowy kontekst renderowania.</li>
+ <li><code>"webgl"</code> (lub <code>"experimental-webgl"</code>), tworzy obiekt {{domxref("WebGLRenderingContext")}} reprezentujący trójwymiarowy kontekst renderowania. Ten kontekst dostępny jest tylko w przeglądarkach w których zaimplementowana jest wersja 1 WebGL (OpenGL ES 2.0).</li>
+ <li><code>"webgl2"</code> tworzy obiekt {{domxref("WebGL2RenderingContext")}} reprezentujący trójwymiarowy kontekst renderowania. Ten kontekst dostępny jest tylko w przeglądarkach w których zaimplementowana jest wersja 2 WebGL (OpenGL ES 3.0). {{experimental_inline}}</li>
+ <li><code>"bitmaprenderer"</code> tworzy {{domxref("ImageBitmapRenderingContext")}}, który zapewnia możliwość zastąpenia treści {{HTMLElement("canvas")}}  na podaną {{domxref("ImageBitmap")}}.</li>
+ </ul>
+
+ <div class="note">
+ <p><strong>Nota</strong>: Identyfikator "<code>experimental-webgl</code>" jest używany przy nowych wdrożeniach WebGL. Wdrożenia te nie uzyskały zgodności z pakietem testowym lub sterowniki graficzne platformy nie są jeszcze stabilne. <a href="https://www.khronos.org/">Grupa Khronos </a>certyfikuje wdrożenia WebGL zgodnie z <a href="https://www.khronos.org/registry/webgl/sdk/tests/CONFORMANCE_RULES.txt">regułami zgodności</a>.</p>
+ </div>
+ </dd>
+ <dt><code><em>contextAttributes</em></code></dt>
+ <dd>
+ <p>Można użyć kilku własności kontekstu przy tworzeniu kontekstu renderowania, dla przykładu: </p>
+
+ <pre class="brush: js">const gl = canvas.getContext('webgl', {
+ antialias: false,
+ depth: false
+});</pre>
+ </dd>
+ <dd>Własności kontekstu 2d:
+ <ul>
+ <li><strong><code>alpha</code></strong>: Boolean wskazujacy czy canvas zawiera kanał alpha. Jeśli ustawione na <code>false</code>, przeglądarka wie, że tło zawsze jest nieprzeźroczyste, co może przyspieszyć rysowanie przeźroczystych treści i obrazków.  </li>
+ <li>{{non-standard_inline}} (Gecko only) <strong><code>willReadFrequently</code></strong>: Boolean wskazujący czy wiele operacji <code>read-back</code> zostało zaplanowanych. Spowoduje wymuszenie użycia oprogramowania (zamiast przyśpieszenia sprzętowego) 2D canvas i może pomóc w oszczędności pamięci przy częstym wywoływaniu {{domxref("CanvasRenderingContext2D.getImageData", "getImageData()")}}. Opcja ta jest dostepna tylko jeśli flaga <code>gfx.canvas.willReadFrequently.enable</code> jest ustawiona na <code>true</code> (która, domyślnie, dotyczy tylko B2G/Firefox OS).</li>
+ <li>{{non-standard_inline}} (Blink only) <strong><code>storage</code></strong>: String wskazujacy jaka pamięć jest używana (domyślnie jest to "stała" ).</li>
+ </ul>
+ Własności kontekstu WebGL:
+
+ <ul>
+ <li><strong><code>alpha</code></strong>: Boolean wskazujacy czy canvas zawiera bufor alpha.</li>
+ <li><strong><code>depth</code></strong>: Boolean wskazujący czy bufor rysunku posiada bufor głębi o wartości co przynajmniej 16 bitów.</li>
+ <li><strong><code>stencil</code></strong>: Boolean wskazujący czy bufor rysunku posiada bufor matrycy o wartości przynajmniej 8 bitów. </li>
+ <li><strong><code>antialias</code></strong>: Boolean wskazujący czy używany ma być <code>anti-aliasing.</code></li>
+ <li><strong><code>premultipliedAlpha</code></strong>: Boolean wskazujący czy projektant strony założył, że  bufor rysunku zawiera kolory ze wstepnie pomnożoną alfą.</li>
+ <li><strong><code>preserveDrawingBuffer</code></strong>: Jeśli ustawiona na <code>true</code>, bufory nie zostaną wyczyszczone i zachowają swoje wartości, dopóki nie zostaną wyczyszczone lub nadpisane przez autora.</li>
+ <li><code><strong>failIfMajorPerformanceCaveat</strong></code>: Boolean wskazujący czy kontekst będzie tworzony, jeśli wydajność systemu jest niska.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h3 id="Wartości_zwrotne">Wartości zwrotne</h3>
+
+<p>{{domxref("RenderingContext")}} jest też</p>
+
+<ul>
+ <li>{{domxref("CanvasRenderingContext2D")}} dla <code>"2d"</code>,</li>
+ <li>{{domxref("WebGLRenderingContext")}} dla <code>"webgl"</code> i <code>"experimental-webgl"</code>,</li>
+ <li>{{domxref("WebGL2RenderingContext")}} dla <code>"webgl2"</code> lub</li>
+ <li>{{domxref("ImageBitmapRenderingContext")}} dla <code>"bitmaprenderer"</code>.</li>
+</ul>
+
+<p>Jeśli <em><code>contextType</code></em> nie może dopasować możliwych kontekstów rysowania, <code><em>null</em></code> zostanie zwrócony.</p>
+
+<h2 id="Przykłady">Przykłady</h2>
+
+<p>Wykorzystując element {{HTMLElement("canvas")}}:</p>
+
+<pre class="brush: html">&lt;canvas id="canvas" width="300" height="300"&gt;&lt;/canvas&gt;
+</pre>
+
+<p>Kontekst <code>2d</code> uzyskać można za pomocą kodu: </p>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+console.log(ctx); // CanvasRenderingContext2D { ... }
+</pre>
+
+<p>Tworzy to <a href="/en-US/docs/Web/API/CanvasRenderingContext2D">kontekst renderowania 2D</a>, po którym można rysować.</p>
+
+<h2 id="Specyfikacja">Specyfikacja</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specyfikacja</th>
+ <th scope="col">Status</th>
+ <th scope="col">Komentarz</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML WHATWG', "scripting.html#dom-canvas-getcontext", "HTMLCanvasElement.getContext")}}</td>
+ <td>{{Spec2('HTML WHATWG')}}</td>
+ <td>Brak zmian od ostatniego snapshota, {{SpecName('HTML5 W3C')}}</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML5.1', "scripting-1.html#dom-canvas-getcontext", "HTMLCanvasElement.getContext")}}</td>
+ <td>{{Spec2('HTML5.1')}}</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML5 W3C', "scripting-1.html#dom-canvas-getcontext", "HTMLCanvasElement.getContext")}}</td>
+ <td>{{Spec2('HTML5 W3C')}}</td>
+ <td>Snapshot {{SpecName('HTML WHATWG')}} zawiera początkową definicje.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Zgodność_przeglądarek">Zgodność przeglądarek</h2>
+
+
+
+<p>{{Compat("api.HTMLCanvasElement.getContext")}}</p>
+
+<h2 id="Zobacz_też">Zobacz też</h2>
+
+<ul>
+ <li>Interfejs definiujacy element, {{domxref("HTMLCanvasElement")}}.</li>
+ <li>{{domxref("OffscreenCanvas.getContext()")}}</li>
+ <li>Dostępne konteksty renderowania: {{domxref("CanvasRenderingContext2D")}}, {{domxref("WebGLRenderingContext")}}, {{domxref("WebGL2RenderingContext")}} i {{domxref("ImageBitmapRenderingContext")}}.</li>
+</ul>