Opis HTML5 <canvas>
Jednak <canvas>
getContext() Metoda zwraca obiekt, który zapewnia metody i właściwości do rysowania na płótnie.
Wniosek ten będzie obejmować właściwości i metody getContext("2d") obiektu, który może być użyty do rysowania tekstu, linie, pola, koła, i wiele innych - na płótnie.
Pomoc Browser Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje elementu.
Element <canvas> 4,0 9,0 2,0 3,1 9,0
Internet Explorer 9, Firefox, Opera, Chrome, Safari i wsparcie <canvas>
Uwaga: Internet Explorer 8 i wcześniejsze wersje, nie obsługuje <canvas>
Kolory, style i Cienie Nieruchomość Opis fillStyle Ustawia lub zwraca kolor, gradient lub wzór używany do wypełnienia rysunek strokeStyle Ustawia lub zwraca kolor, gradient lub wzór stosowany do pociągnięć shadowColor Ustawia lub zwraca kolor używany dla cieni shadowBlur Ustawia lub zwraca poziom rozmycia cienia shadowOffsetX Ustawia lub zwraca poziomą odległość cienia od kształtu shadowOffsetY Ustawia lub zwraca pionową odległość cienia od kształtu
style linii Nieruchomość Opis lineCap Ustawia lub zwraca styl zaślepek końcowych dla linii lineJoin Ustawia lub zwraca typ rożnego, gdy dwie linie spełniają lineWidth Ustawia lub zwraca bieżącą szerokość linii miterLimit Ustawia lub zwraca maksymalną długość ścięcia
prostokąty ścieżki metoda Opis fill() Wypełnia bieżącego rysunku (ścieżka) stroke() Właściwie rysuje ścieżki zostały zdefiniowane beginPath() Początek ścieżki lub resetuje bieżącą ścieżkę moveTo() Przesuwa ścieżki do określonego punktu na płótnie, bez tworzenia linii closePath() Tworzy ścieżkę od bieżącego punktu do punktu wyjścia lineTo() Dodaje nowy punkt i tworzy linię do tego momentu od ostatniego określonego punktu na płótnie clip() Klipy regionu dowolnym kształcie i rozmiarze z oryginalnego płótna quadraticCurveTo() Tworzy krzywej Béziera drugiego stopnia bezierCurveTo() Tworzy krzywą Beziera arc() Tworzy łuk / krzywa (używany do tworzenia okręgów lub części okręgów) arcTo() Tworzy łuk / krzywa między dwoma stycznymi isPointInPath() Zwraca true, jeśli określony punkt znajduje się w bieżącej ścieżce, w przeciwnym przypadku false
transformacje Tekst Nieruchomość Opis font Ustawia lub zwraca bieżące właściwości czcionek dla zawartości tekstowej textAlign Ustawia lub zwraca bieżące wyrównanie zawartości tekstowej textBaseline Ustawia lub zwraca bieżące bazowa tekstu stosowane przy opracowywaniu tekstu
metoda Opis fillText() Rysuje "nadziewane" tekst na płótnie strokeText() Rysuje tekst na płótnie (bez wypełnienia) measureText() Zwraca obiekt, który zawiera szerokość określonego tekstu
Wstawianie obrazów metoda Opis drawImage() Rysuje obraz, płótno, lub film na płótnie
Pixel Manipulation Nieruchomość Opis width Zwraca szerokość obiektu imageData height Zwraca wysokość przedmiotu Imagedata data Zwraca obiekt, który zawiera dane obrazu określonego obiektu imageData
metoda Opis createImageData() Tworzy nowy, pusty imageData obiektu getImageData() Zwraca obiekt imageData która kopiuje dane pikseli dla określonego prostokąta na płótnie putImageData() Umieszcza dane obrazu (od określonego obiektu imageData) z powrotem na płótnie
Komponowanie Nieruchomość Opis globalAlpha Ustawia lub zwraca aktualną wartość przezroczystości alfa lub rysunku globalCompositeOperation Ustawia lub zwraca, jak nowy obraz są rysowane na istniejącym obrazem
Inny metoda Opis save() Zapisuje stan bieżącego kontekstu restore() Zwraca uprzednio zapisanego stanu i atrybuty ścieżki createEvent() getContext() toDataURL()