Metoda createPattern() znacznika HTML canvas
Definicja i użycie
createPattern() Metoda powtarza określony element w określonych kierunkach.
Elementami mogą być obrazy, filmy lub inne elementy <canvas>.
Powtarzane elementy można używać do rysowania/wypełniania prostokątów, okręgów lub linii itp.
Przykład
Używane obrazy:
Powtarzanie obrazu w kierunku poziomym i pionowym:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("lamp");
var pat=ctx.createPattern(img,"repeat");
ctx.rect(0,0,150,100);
ctx.fillStyle=pat;
ctx.fill();
Gramatyka
context.createPattern(image,"repeat|repeat-x|repeat-y|no-repeat");
Wartość parametru
| Parametr | Opis |
|---|---|
| image | Określa używany obraz, rysunek lub element wideo. |
| repeat | Domyślnie. Ten tryb jest powtarzany w kierunku poziomym i pionowym. |
| repeat-x | Ten tryb jest powtarzany tylko w kierunku poziomym. |
| repeat-y | Ten tryb jest powtarzany tylko w kierunku pionowym. |
| no-repeat | Ten tryb jest wyświetlany tylko raz (nie jest powtarzany). |
Obsługa przeglądarek
Liczby w tabeli wskazują na pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Uwaga:Przeglądarki Internet Explorer 8 i wcześniejsze wersje nie obsługują elementu <canvas>.
