[ Leksykon ] [ HTML ] [ JavaScript ] [ WebGL ]

canvas

[_] [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [K] [L] [M] [N] [O] [P] [Q] [R] [S] [T] [U] [V] [W] [X] [Y] [Z]

Obiekty [ WebGL ]

Obiekty getContext "2d":
CanvasGradient() - Interfejs reprezentuje nieprzezroczysty obiekt opisujący gradient
CanvasPattern() - Interfejs prezentuje obiekt opisujący wzór na podstawie obrazu
CanvasRenderingContext2D() - Interfejs CanvasRenderingContext2D zapewnia kontekst renderowania 2D dla <canvas>
createImageBitmap() - metoda globalna tworzy bitmapę z danego źródła
HTMLCanvasElement() - Interfejs do manipulowania i prezentacją elementów HTML <canvas>
ImageBitmap() - reprezentuje obraz bitmapowy, który można narysować canvas bez zbędnych opóźnień
ImageBitmapRenderingContext() - Interfejs renderowania płótna, który zapewnia funkcję zastępowania zawartości płótna
ImageData() - Interfejs reprezentuje podstawowe dane pikseli obszaru elementu <canvas>
OffscreenCanvas() - zapewnia płótno, które można renderować poza ekranem
OffscreenCanvasRenderingContext2D() - służącym do rysowania na bitmapie obiektu OffscreenCanvas
Path2D() - służy do deklarowania ścieżki, zwraca nowo utworzony Path2D obiekt
TextMetrics() - reprezentuje wymiary fragmentu tekstu na płótnie, instancja canvas measureText()

ImageBitmap metody i właściwości getContext "2d":
canvas drawImage() - Rysuje określony obraz
createImageBitmap() - metoda globalna tworzy bitmapę z danego źródła
ImageBitmap() - reprezentuje obraz bitmapowy, który można narysować canvas bez zbędnych opóźnień
ImageBitmap height - właściwość ImageBitmap.height zwraca wysokość obiektu w pikselach CSS
ImageBitmap width - tylko do odczytu ImageBitmap.width zwraca szerokość obiektu w pikselach CSS
ImageBitmap close() - usuwa wszystkie zasoby graficzne powiązane z plikiem ImageBitmap
ImageBitmap createImageBitmap() - metoda globalna tworzy bitmapę z danego źródła

ImageData metody i właściwości getContext "2d":
canvas createImageData() - Tworzy nowy, pusty ImageData obiekt o określonych wymiarach
canvas getImageData() - Zwraca ImageData obiekt reprezentujący podstawowe dane pikseli dla obszaru
canvas putImageData() - Maluje dane z ImageData obiektu na płótnie
ImageData() - Tworzy ImageData obiekt na podstawie podanego Uint8ClampedArray rozmiaru obrazu
ImageData.data - Uint8ClampedArray reprezentujący jednowymiarową tablicę zawierającą dane w kolejności RGBA
ImageData.colorSpace - Ciąg wskazujący przestrzeń kolorów danych obrazu
ImageData.height - Reprezentujący rzeczywistą wysokość w pikselach pliku ImageData
ImageData.width - Reprezentujący rzeczywistą szerokość w pikselach pliku ImageData

Offscreen metody i właściwości getContext "2d":
canvas drawImage() - Rysuje określony obraz
OffscreenCanvas() - konstruktor tworzy nowy OffscreenCanvas obiekt
OffscreenCanvas.height - wysokość płótna poza ekranem
OffscreenCanvas.width - szerokość płótna poza ekranem
OffscreenCanvas getContext() - zwraca kontekst renderowania dla obszaru roboczego poza ekranem
OffscreenCanvas convertToBlob() - tworzy Blob obiekt reprezentujący obraz zawarty w canvas
OffscreenCanvas transferToImageBitmap() - tworzy ImageBitmap obiekt na podstawie ostatnio wyrenderowanego obrazu

Przykłady:

Właściwość CanvasRenderingContext2D.canvas jest referencją tylko do odczytu do HTMLCanvasElement() obiektu powiązanego z danym kontekstem. Może tak być, null jeśli nie ma powiązanego <canvas> element. Wartość obiekt HTMLCanvasElement().

// html
<canvas id="canvas"></canvas>

// javascript, uzyskać odwołanie do elementu canvas, CanvasRenderingContext2D korzystając z canvas właściwości
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
ctx.canvas; // Wartość obiekt HTMLCanvasElement

Opis:

Linki:
[ WebGL ]