/*
* Copyright (C)2005-2013 Haxe Foundation
*
* Permission is hereby granted, free of charge, to any person obtaining a
* copy of this software and associated documentation files (the "Software"),
* to deal in the Software without restriction, including without limitation
* the rights to use, copy, modify, merge, publish, distribute, sublicense,
* and/or sell copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
* DEALINGS IN THE SOFTWARE.
*/
// This file is generated, do not edit!
package js.html;
/** The bulk of the operations available at present with <canvas>
are available through this interface, returned by a call to getContext()
on the <canvas>
element, with "2d" as its argument.
Documentation for this class was provided by MDN. */
@:native("CanvasRenderingContext2D")
extern class CanvasRenderingContext2D extends CanvasRenderingContext
{
var backingStorePixelRatio(default,null) : Float;
/** Color or style to use inside shapes. Default #000
(black). */
var fillStyle : Dynamic;
/** Default value 10px sans-serif
. */
var font : String;
/** Alpha value that is applied to shapes and images before they are composited onto the canvas. Default 1.0
(opaque). */
var globalAlpha : Float;
/** With globalAplpha
applied this sets how shapes and images are drawn onto the existing bitmap. Possible values:
source-atop
source-in
source-out
source-over
(default) destination-atop
destination-in
destination-out
destination-over
lighter
xor
*/
var globalCompositeOperation : String;
var imageSmoothingEnabled : Bool;
/** Type of endings on the end of lines. Possible values: butt
(default), round
, square
*/
var lineCap : String;
var lineDash : Array;
var lineDashOffset : Float;
/** Defines the type of corners where two lines meet. Possible values: round
, bevel
, miter
(default) */
var lineJoin : String;
/** Width of lines. Default 1.0
*/
var lineWidth : Float;
/** Default 10
. */
var miterLimit : Float;
/** Specifies the blurring effect. Default 0
*/
var shadowBlur : Float;
/** Color of the shadow. Default fully-transparent black. */
var shadowColor : String;
/** Horizontal distance the shadow will be offset. Default 0. */
var shadowOffsetX : Float;
/** Vertical distance the shadow will be offset. Default 0. */
var shadowOffsetY : Float;
/** Color or style to use for the lines around shapes. Default #000
(black). */
var strokeStyle : Dynamic;
/** Possible values: start
(default), end
, left
, right
or center
. */
var textAlign : String;
var textBaseline : String;
function arc( x : Float, y : Float, radius : Float, startAngle : Float, endAngle : Float, anticlockwise : Bool ) : Void;
function arcTo( x1 : Float, y1 : Float, x2 : Float, y2 : Float, radius : Float ) : Void;
function beginPath() : Void;
function bezierCurveTo( cp1x : Float, cp1y : Float, cp2x : Float, cp2y : Float, x : Float, y : Float ) : Void;
function clearRect( x : Float, y : Float, width : Float, height : Float ) : Void;
function clearShadow() : Void;
function clip() : Void;
function closePath() : Void;
/** Throws DOMException. */
@:overload( function( imagedata : ImageData ) :ImageData {} )
function createImageData( sw : Float, sh : Float ) : ImageData;
function createLinearGradient( x0 : Float, y0 : Float, x1 : Float, y1 : Float ) : CanvasGradient;
/** Parameters
image
- A DOM
element
to use as the source image for the pattern. This can be any element, although typically you'll use an Image
or <canvas>
. repetition
- ?
Return value
A new DOM canvas pattern object for use in pattern-based operations.
Exceptions thrown
NS_ERROR_DOM_INVALID_STATE_ERR
Requires Gecko 10.0
- The specified
<canvas>
element for the image
parameter is zero-sized (that is, one or both of its dimensions are 0 pixels).
Throws DOMException. */
@:overload( function( canvas : CanvasElement, repetitionType : String ) :CanvasPattern {} )
function createPattern( image : ImageElement, repetitionType : String ) : CanvasPattern;
function createRadialGradient( x0 : Float, y0 : Float, r0 : Float, x1 : Float, y1 : Float, r1 : Float ) : CanvasGradient;
/** Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.
Parameters
image
- An element to draw into the context; the specification permits any image element (that is,
<img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element. dx
- The X coordinate in the destination canvas at which to place the top-left corner of the source
image
. dy
- The Y coordinate in the destination canvas at which to place the top-left corner of the source
image
. dw
- The width to draw the
image
in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn. dh
- The height to draw the
image
in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn. sx
- The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
sy
- The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
sw
- The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by
sx
and sy
to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn. sh
- The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.
The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
INDEX_SIZE_ERR
- If the canvas or source rectangle width or height is zero.
INVALID_STATE_ERR
- The image has no image data.
TYPE_MISMATCH_ERR
- The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.
Compatibility notes
- Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
- Support for flipping the image by using negative values for
sw
and sh
was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
. - Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
now correctly supports CORS for drawing images across domains without tainting the canvas.
Throws DOMException. */
@:overload( function( image : ImageElement, x : Float, y : Float ) :Void {} )
@:overload( function( image : ImageElement, x : Float, y : Float, width : Float, height : Float ) :Void {} )
@:overload( function( image : ImageElement, sx : Float, sy : Float, sw : Float, sh : Float, dx : Float, dy : Float, dw : Float, dh : Float ) :Void {} )
@:overload( function( canvas : CanvasElement, x : Float, y : Float ) :Void {} )
@:overload( function( canvas : CanvasElement, x : Float, y : Float, width : Float, height : Float ) :Void {} )
@:overload( function( canvas : CanvasElement, sx : Float, sy : Float, sw : Float, sh : Float, dx : Float, dy : Float, dw : Float, dh : Float ) :Void {} )
@:overload( function( video : VideoElement, x : Float, y : Float ) :Void {} )
@:overload( function( video : VideoElement, x : Float, y : Float, width : Float, height : Float ) :Void {} )
function drawImage( video : VideoElement, sx : Float, sy : Float, sw : Float, sh : Float, dx : Float, dy : Float, dw : Float, dh : Float ) : Void;
function drawImageFromRect( image : ImageElement, ?sx : Float, ?sy : Float, ?sw : Float, ?sh : Float, ?dx : Float, ?dy : Float, ?dw : Float, ?dh : Float, ?compositeOperation : String ) : Void;
function fill() : Void;
function fillRect( x : Float, y : Float, width : Float, height : Float ) : Void;
function fillText( text : String, x : Float, y : Float, ?maxWidth : Float ) : Void;
function getImageData( sx : Float, sy : Float, sw : Float, sh : Float ) : ImageData;
function getImageDataHD( sx : Float, sy : Float, sw : Float, sh : Float ) : ImageData;
function getLineDash() : Array;
function isPointInPath( x : Float, y : Float ) : Bool;
function lineTo( x : Float, y : Float ) : Void;
function measureText( text : String ) : TextMetrics;
function moveTo( x : Float, y : Float ) : Void;
/** Compatibility notes
- Starting in Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0)
, non-finite values to any of these parameters causes the call to putImageData() to be silently ignored, rather than throwing an exception.
Throws DOMException. */
@:overload( function( imagedata : ImageData, dx : Float, dy : Float ) :Void {} )
function putImageData( imagedata : ImageData, dx : Float, dy : Float, dirtyX : Float, dirtyY : Float, dirtyWidth : Float, dirtyHeight : Float ) : Void;
/** Throws DOMException. */
@:overload( function( imagedata : ImageData, dx : Float, dy : Float ) :Void {} )
function putImageDataHD( imagedata : ImageData, dx : Float, dy : Float, dirtyX : Float, dirtyY : Float, dirtyWidth : Float, dirtyHeight : Float ) : Void;
function quadraticCurveTo( cpx : Float, cpy : Float, x : Float, y : Float ) : Void;
function rect( x : Float, y : Float, width : Float, height : Float ) : Void;
function restore() : Void;
function rotate( angle : Float ) : Void;
function save() : Void;
function scale( sx : Float, sy : Float ) : Void;
function setAlpha( alpha : Float ) : Void;
function setCompositeOperation( compositeOperation : String ) : Void;
@:overload( function( color : String, ?alpha : Float ) :Void {} )
@:overload( function( grayLevel : Float, ?alpha : Float ) :Void {} )
@:overload( function( r : Float, g : Float, b : Float, a : Float ) :Void {} )
function setFillColor( c : Float, m : Float, y : Float, k : Float, a : Float ) : Void;
function setLineCap( cap : String ) : Void;
function setLineDash( dash : Array ) : Void;
function setLineJoin( join : String ) : Void;
function setLineWidth( width : Float ) : Void;
function setMiterLimit( limit : Float ) : Void;
@:overload( function( width : Float, height : Float, blur : Float, ?color : String, ?alpha : Float ) :Void {} )
@:overload( function( width : Float, height : Float, blur : Float, grayLevel : Float, ?alpha : Float ) :Void {} )
@:overload( function( width : Float, height : Float, blur : Float, r : Float, g : Float, b : Float, a : Float ) :Void {} )
function setShadow( width : Float, height : Float, blur : Float, c : Float, m : Float, y : Float, k : Float, a : Float ) : Void;
@:overload( function( color : String, ?alpha : Float ) :Void {} )
@:overload( function( grayLevel : Float, ?alpha : Float ) :Void {} )
@:overload( function( r : Float, g : Float, b : Float, a : Float ) :Void {} )
function setStrokeColor( c : Float, m : Float, y : Float, k : Float, a : Float ) : Void;
function setTransform( m11 : Float, m12 : Float, m21 : Float, m22 : Float, dx : Float, dy : Float ) : Void;
function stroke() : Void;
function strokeRect( x : Float, y : Float, width : Float, height : Float, ?lineWidth : Float ) : Void;
function strokeText( text : String, x : Float, y : Float, ?maxWidth : Float ) : Void;
function transform( m11 : Float, m12 : Float, m21 : Float, m22 : Float, dx : Float, dy : Float ) : Void;
function translate( tx : Float, ty : Float ) : Void;
}