Class HTMLCanvasElement
- Namespace
- CSharpToJavaScript.APIs.JS
- Assembly
- CSharpToJavaScript.dll
The HTMLCanvasElement interface provides properties and methods for manipulating the layout and presentation of canvas elements. The HTMLCanvasElement interface also inherits the properties and methods of the HTMLElement interface.
[Value("HTMLCanvasElement")]
public class HTMLCanvasElement : HTMLElement- Inheritance
-
HTMLCanvasElement
- Inherited Members
Remarks
-HTML element implementing this interface: canvas
Constructors
HTMLCanvasElement()
public HTMLCanvasElement()Properties
Height
The HTMLCanvasElement.height property is a
positive integer reflecting the height HTML
attribute of the canvas element interpreted in CSS pixels. When the
attribute is not specified, or if it is set to an invalid value, like a negative, the
default value of 150 is used.
[Value("height")]
public ulong Height { get; set; }Property Value
- ulong
A number.
Remarks
Setting the height property resets the entire rendering context to its default state. This includes clearing the canvas (backing buffer), resetting the current path, and resetting all properties like fillStyle and globalCompositeOperation. This reset occurs for all context types, and occurs even when setting height to its current value. To restore the previous content after changing the height, use CanvasRenderingContext2D.GetImageData and CanvasRenderingContext2D.PutImageData. Context properties must be separately tracked and restored.
This is one of the two properties, the other being
Width, that controls the size of the canvas.
-HTMLCanvasElement: Interface used to define the HTMLCanvasElement.height property
-Width: Other property used to control the size of the canvas
-Height
-Height
-Height
-Height
-Height
-Height
Width
The HTMLCanvasElement.width property is a
positive integer reflecting the width HTML
attribute of the canvas element interpreted in CSS pixels. When the
attribute is not specified, or if it is set to an invalid value, like a negative, the
default value of 300 is used.
[Value("width")]
public ulong Width { get; set; }Property Value
- ulong
A number.
Remarks
Setting the width property resets the entire rendering context to its default state. This includes clearing the canvas (backing buffer), resetting the current path, and resetting all properties like fillStyle and globalCompositeOperation. This reset occurs for all context types, and occurs even when setting width to its current value. To restore the previous content after changing the width, use CanvasRenderingContext2D.GetImageData and CanvasRenderingContext2D.PutImageData. Context properties must be separately tracked and restored.
This is one of the two properties, the other being
Height, that controls the size of the canvas.
-HTMLCanvasElement: Interface used to define the HTMLCanvasElement.width property
-Height: Other property used to control the size of the canvas
-Width
-Width
-Width
-Width
-Width
-Width
Methods
CaptureStream(Number)
The captureStream() method of the HTMLCanvasElement interface returns a MediaStream
which includes a CanvasCaptureMediaStreamTrack containing a real-time video capture of the canvas's contents.
[Value("captureStream")]
public MediaStream CaptureStream(Number frameRequestRate = null)Parameters
frameRequestRateNumber
Returns
- MediaStream
A reference to a MediaStream object, which has a single
CanvasCaptureMediaStreamTrack in it.
Remarks
-CaptureStream(), which allows capturing a stream
from a media element.
-MediaStream
-Media Capture and Streams API
GetContext(string, dynamic)
The HTMLCanvasElement.getContext() method returns a drawing context on the canvas, or null if the context identifier is not supported, or the canvas has already been set to a different context mode.
[Value("getContext")]
public Union70? GetContext(string contextId, dynamic options = null)Parameters
contextIdstringoptionsdynamic
Returns
- Union70?
A rendering context which is either aIf the context identifier is not supported, or the canvas has already been set to a different context mode,
nullis returned.
Remarks
Later calls to this method on the same canvas element, with the same contextType argument, will always return the same drawing context instance as was returned the first time the method was invoked. It is not possible to get a different drawing context object on a given canvas element.
-HTMLCanvasElement: Interface used to define the HTMLCanvasElement.getContext() method
-GetContext(OffscreenRenderingContextId, dynamic)
-GetContextAttributes(), WebGLRenderingContext.GetContextAttributes
-CanvasRenderingContext2D, ImageBitmapRenderingContext,
WebGLRenderingContext, WebGL2RenderingContext, GPUCanvasContext: Available rendering contexts
-DCI-P3 color space on Wikipedia
-sRGB color space on Wikipedia
ToBlob(BlobCallback, string, dynamic)
The HTMLCanvasElement.toBlob() method creates a Blob object representing the image contained in the canvas.
This file may be cached on the disk or stored in memory at the discretion of the user agent.
[Value("toBlob")]
public GlobalObject.Undefined ToBlob(BlobCallback callback, string type = null, dynamic quality = null)Parameters
callbackBlobCallbacktypestringqualitydynamic
Returns
Remarks
The desired file format and image quality may be specified.
If the file format is not specified, or if the given format is not supported, then the data will be exported as image/png.
Browsers are required to support image/png; many will support additional formats including image/jpeg and image/webp.
The created image will have a resolution of 96dpi for file formats that support encoding resolution metadata.
-Blob
ToDataURL(string, dynamic)
The HTMLCanvasElement.toDataURL() method returns a data URL containing a representation of the image in the format specified by the type parameter.
[Value("toDataURL")]
public string ToDataURL(string type = null, dynamic quality = null)Parameters
typestringqualitydynamic
Returns
- string
A string containing the requested data URL.If the height or width of the canvas is
0or larger than the maximum canvas size, the string"data:,"is returned.
Remarks
The desired file format and image quality may be specified.
If the file format is not specified, or if the given format is not supported, then the data will be exported as image/png.
In other words, if the returned value starts with data:image/png for any other requested type, then that format is not supported.
Browsers are required to support image/png; many will support additional formats including image/jpeg and image/webp.
The created image data will have a resolution of 96dpi for file formats that support encoding resolution metadata.
WARNING
toDataURL()encodes the whole image in an in-memory string. For larger images, this can have performance implications, and may even overflow browsers' URL length limit when assigned to Src. You should generally prefertoBlob()instead, in combination with URLcreateObjectURL.
TransferControlToOffscreen()
The HTMLCanvasElement.transferControlToOffscreen() method transfers control to an OffscreenCanvas object, either on the main thread or on a worker.
[Value("transferControlToOffscreen")]
public OffscreenCanvas TransferControlToOffscreen()Returns
- OffscreenCanvas
An OffscreenCanvas object.
Remarks
-The interface defining this method, HTMLCanvasElement
-OffscreenCanvas