Context2dItem (Charba - J2CL and GWT charts library based on CHART.JS)

java.lang.Object
- org.pepstock.charba.client.dom.BaseEventTarget
- - org.pepstock.charba.client.dom.BaseNode
  - - org.pepstock.charba.client.dom.BaseElement
    - - org.pepstock.charba.client.dom.BaseHtmlElement
      - org.pepstock.charba.client.dom.elements.Context2dItem

```
@JsType(isNative=true,
        name="CanvasRenderingContext2D",
        namespace="<global>")
public final class Context2dItem
extends BaseHtmlElement
```
DOM object which provides the 2D rendering context for the drawing surface of a canvas element.
It is used for drawing shapes, text, images, and other objects.

Author:

Andrea "Stock" Stocchero

Nested Class Summary
- Nested classes/interfaces inherited from class org.pepstock.charba.client.dom.BaseEventTarget
  BaseEventTarget.EventListenerCallback

Method Summary

All Methods Instance Methods Concrete Methods
Modifier and Type	Method and Description
`void`	`arc(double x, double y, double radius, double startAngle, double endAngle)` Adds a circular arc to the current sub-path. The arc method creates a circular arc centered at (x, y) with a radius of radius. The path starts at "startAngle", ends at "endAngle", and travels in the clockwise direction.
`void`	`arc(double x, double y, double radius, double startAngle, double endAngle, boolean anticlockwise)` Adds a circular arc to the current sub-path. The arc method creates a circular arc centered at (x, y) with a radius of radius. The path starts at "startAngle", ends at "endAngle", and travels in the direction given by "anticlockwise" (defaulting to clockwise).
`void`	`arcTo(double x1, double y1, double x2, double y2, double radius)` adds a circular arc to the current sub-path, using the given control points and radius. The arc is automatically connected to the path's latest point with a straight line, if necessary for the specified parameters. This method is commonly used for making rounded corners.
`void`	`beginPath()` Starts a new path by emptying the list of sub-paths. Call this method when you want to create a new path.
`void`	`bezierCurveTo(double cp1x, double cp1y, double cp2x, double cp2y, double x, double y)` Adds a cubic Bézier curve to the current sub-path. It requires three points: the first two are control points and the third one is the end point. The starting point is the latest point in the current path.
`void`	`clearRect(double x, double y, double width, double height)` Erases the pixels in a rectangular area by setting them to transparent black.
`void`	`clip()` Turns the current or given path in the the current clipping region. It replaces any previous clipping region..
`void`	`closePath()` Causes the point of the pen to move back to the start of the current sub-path. It tries to draw a straight line from the current point to the start. If the shape has already been closed or has only one point, this function does nothing.
`CanvasGradientItem`	`createLinearGradient(double x0, double y0, double x1, double y1)` Creates a gradient along the line connecting two given coordinates.
`CanvasPatternItem`	`createPattern(Canvas canvas, Repetition repetition)` Creates a pattern using the specified canvas and repetition.
`CanvasPatternItem`	`createPattern(Img image, Repetition repetition)` Creates a pattern using the specified image and repetition.
`CanvasGradientItem`	`createRadialGradient(double x0, double y0, double r0, double x1, double y1, double r1)` Creates a radial gradient using the size and coordinates of two circles.
`void`	`drawImage(Canvas canvas, double dx, double dy)` Draws a canvas onto the canvas.
`void`	`drawImage(Canvas canvas, double dx, double dy, double dWidth)` Draws a canvas onto the canvas.
`void`	`drawImage(Canvas canvas, double dx, double dy, double dWidth, double dHeight)` Draws a canvas onto the canvas.
`void`	`drawImage(Img image, double dx, double dy)` Draws an image onto the canvas.
`void`	`drawImage(Img image, double dx, double dy, double dWidth)` Draws an image onto the canvas.
`void`	`drawImage(Img image, double dx, double dy, double dWidth, double dHeight)` Draws an image onto the canvas.
`void`	`fill()` Fills the current or given path with the current fill style.
`void`	`fillRect(double x, double y, double width, double height)` Draws a rectangle that is filled according to the current fill style. This method draws directly to the canvas without modifying the current path, so any subsequent fill or stroke calls will have no effect on it.
`void`	`fillText(String text, double x, double y)` Draws a text string at the specified coordinates, filling the string's characters with the current fill style.
`void`	`fillText(String text, double x, double y, double maxWidth)` Draws a text string at the specified coordinates, filling the string's characters with the current fill style. An parameter allows specifying a maximum width for the rendered text, which the user agent will achieve by condensing the text or by using a lower font size.
`Canvas`	`getCanvas()` Returns the canvas of the canvas rendering context 2D object.
`IsColor`	`getFillColor()` Returns the filling styling is used for colors inside shapes.
`String`	`getFillColorAsString()` Returns the filling styling is used for colors inside shapes.
`CanvasGradientItem`	`getFillGradient()` Returns the filling styling is used for gradient style inside shapes.
`CanvasPatternItem`	`getFillPattern()` Returns the filling styling is used for pattern style inside shapes.
`String`	`getFont()` Returns the current text style to use when drawing text. This string uses the same syntax as the CSS font specifier.
`GlobalCompositeOperation`	`getGlobalCompositeOperation()` Returns the type of compositing operation to apply when drawing new shapes.
`ImageData`	`getImageData(double sx, double sy, double sw, double sh)` Returns an `ImageData` object representing the underlying pixel data for a specified portion of the canvas.
`CapStyle`	`getLineCap()` Returns the shape used to draw the end points of lines.
`double`	`getLineDashOffset()` Returns the line dash offset, or "phase.". Specifies where to start a dash array on a line.
`JoinStyle`	`getLineJoin()` Returns the type of corners where two lines meet.
`double`	`getLineWidth()` Returns the thickness of lines.
`double`	`getMiterLimit()` Returns the miter limit ratio.
`double`	`getShadowBlur()` Returns the amount of blur applied to shadows.
`String`	`getShadowColor()` Returns the color of shadows. The shadow's rendered opacity will be affected by the opacity of the fillStyle color when filling, and of the strokeStyle color when stroking.
`double`	`getShadowOffsetX()` Returns the distance that shadows will be offset horizontally.
`double`	`getShadowOffsetY()` Returns the distance that shadows will be offset vertically.
`IsColor`	`getStrokeColor()` Returns the stroke color is used for the lines around shapes.
`String`	`getStrokeColorAsString()` Returns the stroke color is used for the lines around shapes.
`CanvasGradientItem`	`getStrokeGradient()` Returns the stroke gradient is used for the lines around shapes.
`CanvasPatternItem`	`getStrokePattern()` Returns the stroke pattern is used for the lines around shapes.
`TextAlign`	`getTextAlign()` Returns the current text alignment used when drawing text.
`TextBaseline`	`getTextBaseline()` Returns the current text baseline used when drawing text.
`void`	`lineTo(double x, double y)` adds a straight line to the current sub-path by connecting the sub-path's last point to the specified (x, y) coordinates.
`TextMetricsItem`	`measureText(String text)` Returns a text metric item that contains information about the measured text.
`void`	`moveTo(double x, double y)` Begins a new sub-path at the point specified by the given (x, y) coordinates.
`void`	`putImageData(ImageData imagedata, double dx, double dy)` Paints data from the given `ImageData` object onto the canvas.
`void`	`quadraticCurveTo(double cpx, double cpy, double x, double y)` Adds a quadratic Bézier curve to the current sub-path. It requires two points: the first one is a control point and the second one is the end point. The starting point is the latest point in the current path.
`void`	`rect(double x, double y, double width, double height)` Adds a rectangle to the current path.
`void`	`restore()` Restores the most recently saved canvas state by popping the top entry in the drawing state stack. If there is no saved state, this method does nothing.
`void`	`rotate(double angle)` Adds a rotation to the transformation matrix.
`void`	`save()` Saves the entire state of the canvas by pushing the current state onto a stack.
`void`	`scale(double x, double y)` Adds a scaling transformation to the canvas units horizontally and/or vertically.
`void`	`setFillColor(IsColor color)` Sets the filling styling is used for colors inside shapes.
`void`	`setFillColor(String color)` Sets the filling styling is used for colors inside shapes.
`void`	`setFillGradient(CanvasGradientItem gradient)` Sets the filling styling is used for gradient style inside shapes.
`void`	`setFillPattern(CanvasPatternItem pattern)` Sets the filling styling is used for pattern style inside shapes.
`void`	`setFont(String font)` Sets the current text style to use when drawing text. This string uses the same syntax as the CSS font specifier.
`void`	`setGlobalCompositeOperation(GlobalCompositeOperation globalCompositeOperation)` Sets the type of compositing operation to apply when drawing new shapes.
`void`	`setLineCap(CapStyle lineCap)` Sets the shape used to draw the end points of lines.
`void`	`setLineDash(int... lineDash)` Sets the line dash pattern used when stroking lines. It uses an array of values that specify alternating lengths of lines and gaps which describe the pattern.
`void`	`setLineDash(List<Integer> lineDash)` Sets the line dash pattern used when stroking lines. It uses a list of values that specify alternating lengths of lines and gaps which describe the pattern.
`void`	`setLineDashOffset(double lineDashOffset)` Sets the line dash offset, or "phase.". Specifies where to start a dash array on a line.
`void`	`setLineJoin(JoinStyle lineJoin)` Sets the type of corners where two lines meet.
`void`	`setLineWidth(double lineWidth)` Sets the thickness of lines.
`void`	`setMiterLimit(double miterLimit)` Sets the miter limit ratio.
`void`	`setShadowBlur(double shadowBlur)` Sets the amount of blur applied to shadows.
`void`	`setShadowColor(String shadowColor)` Sets the color of shadows. The shadow's rendered opacity will be affected by the opacity of the fillStyle color when filling, and of the strokeStyle color when stroking.
`void`	`setShadowOffsetX(double shadowOffsetX)` Sets the distance that shadows will be offset horizontally.
`void`	`setShadowOffsetY(double shadowOffsetY)` Sets the distance that shadows will be offset vertically.
`void`	`setStrokeColor(IsColor color)` Sets the stroke color is used for the lines around shapes.
`void`	`setStrokeColor(String color)` Sets the stroke color is used for the lines around shapes.
`void`	`setStrokeGradient(CanvasGradientItem gradient)` Sets the stroke gradient is used for the lines around shapes.
`void`	`setStrokePattern(CanvasPatternItem pattern)` Sets the stroke pattern is used for the lines around shapes.
`void`	`setTextAlign(TextAlign textAlign)` Sets the current text alignment used when drawing text.
`void`	`setTextBaseline(TextBaseline textBaseline)` Sets the current text baseline used when drawing text.
`void`	`stroke()` Strokes (outlines) the current or given path with the current stroke style. Strokes are aligned to the center of a path; in other words, half of the stroke is drawn on the inner side, and half on the outer side.
`void`	`strokeRect(double x, double y, double width, double height)` Draws a rectangle that is stroked (outlined) according to the current strokeStyle and other context settings.
`void`	`strokeText(String text, double x, double y)` Strokes - that is, draws the outlines of - the characters of a text string at the specified coordinates.
`void`	`strokeText(String text, double x, double y, double maxWidth)` Strokes - that is, draws the outlines of - the characters of a text string at the specified coordinates. An optional parameter allows specifying a maximum width for the rendered text, which the user agent will achieve by condensing the text or by using a lower font size.
`void`	`transform(double m11, double m12, double m21, double m22, double dx, double dy)` Multiplies the current transformation with the matrix described by the arguments of this method. This lets you scale, rotate, translate (move), and skew the context.
`void`	`translate(double x, double y)` Adds a translation transformation to the current matrix by moving the canvas and its origin x units horizontally and y units vertically on the grid.

Methods inherited from class org.pepstock.charba.client.dom.BaseHtmlElement
getAbsoluteLeft, getAbsoluteTop, getInnerText, getOffsetHeight, getOffsetLeft, getOffsetParent, getOffsetTop, getOffsetWidth, getParentHtmlElement, getScrollingElement, getStyle, getTabIndex, removeFromParent, setInnerText, setTabIndex

Methods inherited from class org.pepstock.charba.client.dom.BaseElement
getAttributes, getChildElementCount, getClientHeight, getClientLeft, getClientTop, getClientWidth, getElementsByTagName, getFirstElementChild, getId, getInnerHTML, getLastElementChild, getNextElementSibling, getOuterHTML, getPreviousElementSibling, getScrollHeight, getScrollLeft, getScrollTop, getScrollWidth, getTagName, hasAttributes, remove, setId, setInnerHTML

Methods inherited from class org.pepstock.charba.client.dom.BaseNode
appendChild, cloneNode, getChildNodes, getFirstChild, getLastChild, getNextSibling, getNodeName, getNodeType, getNodeValue, getOwnerDocument, getParentElement, getParentNode, getPreviousSibling, getTextContent, hasChildNodes, insertBefore, removeAllChildren, removeChild, setNodeValue, setTextContent

Methods inherited from class org.pepstock.charba.client.dom.BaseEventTarget
addEventListener, removeEventListener

Methods inherited from class java.lang.Object
clone, equals, finalize, getClass, hashCode, notify, notifyAll, toString, wait, wait, wait

- Method Detail
  - getCanvas
```
@JsProperty
public Canvas getCanvas()
```
    Returns the canvas of the canvas rendering context 2D object.
    
    Returns:
    
    the canvas of the canvas rendering context 2D object
  - setFillColor
```
@JsOverlay
public void setFillColor(String color)
```
    Sets the filling styling is used for colors inside shapes.
    
    Parameters:
    
    color - color to use inside shapes
  - setFillColor
```
@JsOverlay
public void setFillColor(IsColor color)
```
    Sets the filling styling is used for colors inside shapes.
    
    Parameters:
    
    color - color to use inside shapes
  - setFillGradient
```
@JsOverlay
public void setFillGradient(CanvasGradientItem gradient)
```
    Sets the filling styling is used for gradient style inside shapes.
    
    Parameters:
    
    gradient - gradient style to use inside shapes
  - setFillPattern
```
@JsOverlay
public final void setFillPattern(CanvasPatternItem pattern)
```
    Sets the filling styling is used for pattern style inside shapes.
    
    Parameters:
    
    pattern - pattern style to use inside shapes
  - getFillColorAsString
```
@JsOverlay
public String getFillColorAsString()
```
    Returns the filling styling is used for colors inside shapes.
    
    Returns:
    
    color to use inside shapes
  - getFillColor
```
@JsOverlay
public IsColor getFillColor()
```
    Returns the filling styling is used for colors inside shapes.
    
    Returns:
    
    color to use inside shapes
  - getFillGradient
```
@JsOverlay
public CanvasGradientItem getFillGradient()
```
    Returns the filling styling is used for gradient style inside shapes.
    
    Returns:
    
    gradient style to use inside shapes
  - getFillPattern
```
@JsOverlay
public final CanvasPatternItem getFillPattern()
```
    Returns the filling styling is used for pattern style inside shapes.
    
    Returns:
    
    pattern style to use inside shapes
  - getFont
```
@JsProperty
public String getFont()
```
    Returns the current text style to use when drawing text.
    This string uses the same syntax as the CSS font specifier.
    
    Returns:
    
    the current text style to use when drawing text
  - setFont
```
@JsProperty
public void setFont(String font)
```
    Sets the current text style to use when drawing text.
    This string uses the same syntax as the CSS font specifier.
    
    Parameters:
    
    font - the current text style to use when drawing text
  - setLineCap
```
@JsOverlay
public void setLineCap(CapStyle lineCap)
```
    Sets the shape used to draw the end points of lines.
    
    Parameters:
    
    lineCap - the shape used to draw the end points of lines.
  - getLineCap
```
@JsOverlay
public CapStyle getLineCap()
```
    Returns the shape used to draw the end points of lines.
    
    Returns:
    
    the shape used to draw the end points of lines
  - getLineDashOffset
```
@JsProperty
public double getLineDashOffset()
```
    Returns the line dash offset, or "phase.".
    Specifies where to start a dash array on a line.
    
    Returns:
    
    the line dash offset, or "phase."
  - setLineDashOffset
```
@JsProperty
public void setLineDashOffset(double lineDashOffset)
```
    Sets the line dash offset, or "phase.".
    Specifies where to start a dash array on a line.
    
    Parameters:
    
    lineDashOffset - the line dash offset, or "phase."
  - setLineJoin
```
@JsOverlay
public void setLineJoin(JoinStyle lineJoin)
```
    Sets the type of corners where two lines meet.
    
    Parameters:
    
    lineJoin - the type of corners where two lines meet
  - getLineJoin
```
@JsOverlay
public JoinStyle getLineJoin()
```
    Returns the type of corners where two lines meet.
    
    Returns:
    
    the type of corners where two lines meet
  - getLineWidth
```
@JsProperty
public double getLineWidth()
```
    Returns the thickness of lines.
    
    Returns:
    
    the thickness of lines
  - setLineWidth
```
@JsProperty
public void setLineWidth(double lineWidth)
```
    Sets the thickness of lines.
    
    Parameters:
    
    lineWidth - the thickness of lines
  - setLineDash
```
@JsOverlay
public void setLineDash(int... lineDash)
```
    Sets the line dash pattern used when stroking lines.
    It uses an array of values that specify alternating lengths of lines and gaps which describe the pattern.
    
    Parameters:
    
    lineDash - an array of integers that specify distances to alternately draw a line and a gap (in coordinate space units).
    If the number of elements in the array is odd, the elements of the array get copied and concatenated.
    If the array is empty, the line dash list is cleared and line strokes return to being solid.
  - setLineDash
```
@JsOverlay
public void setLineDash(List<Integer> lineDash)
```
    Sets the line dash pattern used when stroking lines.
    It uses a list of values that specify alternating lengths of lines and gaps which describe the pattern.
    
    Parameters:
    
    lineDash - a list of integers that specify distances to alternately draw a line and a gap (in coordinate space units).
    If the number of elements in the list is odd, the elements of the list get copied and concatenated.
    If the list is empty, the line dash list is cleared and line strokes return to being solid.
  - getMiterLimit
```
@JsProperty
public double getMiterLimit()
```
    Returns the miter limit ratio.
    
    Returns:
    
    the miter limit ratio
  - setMiterLimit
```
@JsProperty
public void setMiterLimit(double miterLimit)
```
    Sets the miter limit ratio.
    
    Parameters:
    
    miterLimit - the miter limit ratio
  - getShadowBlur
```
@JsProperty
public double getShadowBlur()
```
    Returns the amount of blur applied to shadows.
    
    Returns:
    
    the amount of blur applied to shadows.
    The default is 0 (no blur).
  - setShadowBlur
```
@JsProperty
public void setShadowBlur(double shadowBlur)
```
    Sets the amount of blur applied to shadows.
    
    Parameters:
    
    shadowBlur - the amount of blur applied to shadows.
    The default is 0 (no blur).
  - getShadowColor
```
@JsProperty
public String getShadowColor()
```
    Returns the color of shadows.
    The shadow's rendered opacity will be affected by the opacity of the fillStyle color when filling, and of the strokeStyle color when stroking.
    
    Returns:
    
    the color of shadows
  - setShadowColor
```
@JsProperty
public void setShadowColor(String shadowColor)
```
    Sets the color of shadows.
    The shadow's rendered opacity will be affected by the opacity of the fillStyle color when filling, and of the strokeStyle color when stroking.
    
    Parameters:
    
    shadowColor - the color of shadows
  - getShadowOffsetX
```
@JsProperty
public double getShadowOffsetX()
```
    Returns the distance that shadows will be offset horizontally.
    
    Returns:
    
    the distance that shadows will be offset horizontally
  - setShadowOffsetX
```
@JsProperty
public void setShadowOffsetX(double shadowOffsetX)
```
    Sets the distance that shadows will be offset horizontally.
    
    Parameters:
    
    shadowOffsetX - the distance that shadows will be offset horizontally
  - getShadowOffsetY
```
@JsProperty
public double getShadowOffsetY()
```
    Returns the distance that shadows will be offset vertically.
    
    Returns:
    
    the distance that shadows will be offset vertically
  - setShadowOffsetY
```
@JsProperty
public void setShadowOffsetY(double shadowOffsetY)
```
    Sets the distance that shadows will be offset vertically.
    
    Parameters:
    
    shadowOffsetY - the distance that shadows will be offset vertically.
  - setStrokeColor
```
@JsOverlay
public void setStrokeColor(String color)
```
    Sets the stroke color is used for the lines around shapes.
    
    Parameters:
    
    color - the stroke color is used for the lines around shapes
  - setStrokeColor
```
@JsOverlay
public void setStrokeColor(IsColor color)
```
    Sets the stroke color is used for the lines around shapes.
    
    Parameters:
    
    color - the stroke color is used for the lines around shapes
  - setStrokeGradient
```
@JsOverlay
public void setStrokeGradient(CanvasGradientItem gradient)
```
    Sets the stroke gradient is used for the lines around shapes.
    
    Parameters:
    
    gradient - the stroke gradient is used for the lines around shapes
  - setStrokePattern
```
@JsOverlay
public final void setStrokePattern(CanvasPatternItem pattern)
```
    Sets the stroke pattern is used for the lines around shapes.
    
    Parameters:
    
    pattern - the stroke pattern is used for the lines around shapes
  - getStrokeColorAsString
```
@JsOverlay
public String getStrokeColorAsString()
```
    Returns the stroke color is used for the lines around shapes.
    
    Returns:
    
    color to use for the lines around shapes
  - getStrokeColor
```
@JsOverlay
public IsColor getStrokeColor()
```
    Returns the stroke color is used for the lines around shapes.
    
    Returns:
    
    color to use for the lines around shapes
  - getStrokeGradient
```
@JsOverlay
public CanvasGradientItem getStrokeGradient()
```
    Returns the stroke gradient is used for the lines around shapes.
    
    Returns:
    
    gradient style to use for the lines around shapes
  - getStrokePattern
```
@JsOverlay
public final CanvasPatternItem getStrokePattern()
```
    Returns the stroke pattern is used for the lines around shapes.
    
    Returns:
    
    pattern style to use for the lines around shapes
  - setTextAlign
```
@JsOverlay
public void setTextAlign(TextAlign textAlign)
```
    Sets the current text alignment used when drawing text.
    
    Parameters:
    
    textAlign - the current text alignment used when drawing text
  - getTextAlign
```
@JsOverlay
public TextAlign getTextAlign()
```
    Returns the current text alignment used when drawing text.
    
    Returns:
    
    the current text alignment used when drawing text
  - setTextBaseline
```
@JsOverlay
public void setTextBaseline(TextBaseline textBaseline)
```
    Sets the current text baseline used when drawing text.
    
    Parameters:
    
    textBaseline - the current text baseline used when drawing text
  - getTextBaseline
```
@JsOverlay
public TextBaseline getTextBaseline()
```
    Returns the current text baseline used when drawing text.
    
    Returns:
    
    the current text baseline used when drawing text
  - setGlobalCompositeOperation
```
@JsOverlay
public void setGlobalCompositeOperation(GlobalCompositeOperation globalCompositeOperation)
```
    Sets the type of compositing operation to apply when drawing new shapes.
    
    Parameters:
    
    globalCompositeOperation - which of the compositing or blending mode operations to use
  - getGlobalCompositeOperation
```
@JsOverlay
public GlobalCompositeOperation getGlobalCompositeOperation()
```
    Returns the type of compositing operation to apply when drawing new shapes.
    
    Returns:
    
    which of the compositing or blending mode operations to use
  - arc
```
@JsMethod
public void arc(double x,
                          double y,
                          double radius,
                          double startAngle,
                          double endAngle,
                          boolean anticlockwise)
```
    Adds a circular arc to the current sub-path.
    The arc method creates a circular arc centered at (x, y) with a radius of radius.
    The path starts at "startAngle", ends at "endAngle", and travels in the direction given by "anticlockwise" (defaulting to clockwise).
    
    Parameters:
    
    x - the horizontal coordinate of the arc's center
    
    y - the vertical coordinate of the arc's center
    
    radius - the arc's radius. Must be positive
    
    startAngle - the angle at which the arc starts in radians, measured from the positive x-axis
    
    endAngle - the angle at which the arc ends in radians, measured from the positive x-axis
    
    anticlockwise - if true, draws the arc counter-clockwise between the start and end angles.
    The default is false(clockwise).
  - arc
```
@JsMethod
public void arc(double x,
                          double y,
                          double radius,
                          double startAngle,
                          double endAngle)
```
    Adds a circular arc to the current sub-path.
    The arc method creates a circular arc centered at (x, y) with a radius of radius.
    The path starts at "startAngle", ends at "endAngle", and travels in the clockwise direction.
    
    Parameters:
    
    x - the horizontal coordinate of the arc's center
    
    y - the vertical coordinate of the arc's center
    
    radius - the arc's radius. Must be positive
    
    startAngle - the angle at which the arc starts in radians, measured from the positive x-axis
    
    endAngle - the angle at which the arc ends in radians, measured from the positive x-axis
  - arcTo
```
@JsMethod
public void arcTo(double x1,
                            double y1,
                            double x2,
                            double y2,
                            double radius)
```
    adds a circular arc to the current sub-path, using the given control points and radius.
    The arc is automatically connected to the path's latest point with a straight line, if necessary for the specified parameters.
    This method is commonly used for making rounded corners.
    
    Parameters:
    
    x1 - the x-axis coordinate of the first control point
    
    y1 - the y-axis coordinate of the first control point
    
    x2 - the x-axis coordinate of the second control point
    
    y2 - the y-axis coordinate of the second control point
    
    radius - the arc's radius. Must be non-negative.
  - beginPath
```
@JsMethod
public void beginPath()
```
    Starts a new path by emptying the list of sub-paths.
    Call this method when you want to create a new path.
  - bezierCurveTo
```
@JsMethod
public void bezierCurveTo(double cp1x,
                                    double cp1y,
                                    double cp2x,
                                    double cp2y,
                                    double x,
                                    double y)
```
    Adds a cubic Bézier curve to the current sub-path.
    It requires three points: the first two are control points and the third one is the end point.
    The starting point is the latest point in the current path.
    
    Parameters:
    
    cp1x - the x-axis coordinate of the first control point
    
    cp1y - the y-axis coordinate of the first control point
    
    cp2x - the x-axis coordinate of the second control point
    
    cp2y - the y-axis coordinate of the second control point
    
    x - the x-axis coordinate of the end point
    
    y - the y-axis coordinate of the end point
  - clearRect
```
@JsMethod
public void clearRect(double x,
                                double y,
                                double width,
                                double height)
```
    Erases the pixels in a rectangular area by setting them to transparent black.
    
    Parameters:
    
    x - the x-axis coordinate of the rectangle's starting point
    
    y - the y-axis coordinate of the rectangle's starting point
    
    width - the rectangle's width. Positive values are to the right, and negative to the left
    
    height - the rectangle's height. Positive values are down, and negative are up
  - clip
```
@JsMethod
public void clip()
```
    Turns the current or given path in the the current clipping region.
    It replaces any previous clipping region..
  - closePath
```
@JsMethod
public void closePath()
```
    Causes the point of the pen to move back to the start of the current sub-path.
    It tries to draw a straight line from the current point to the start.
    If the shape has already been closed or has only one point, this function does nothing.
  - createLinearGradient
```
@JsMethod
public CanvasGradientItem createLinearGradient(double x0,
                                                         double y0,
                                                         double x1,
                                                         double y1)
```
    Creates a gradient along the line connecting two given coordinates.
    
    Parameters:
    
    x0 - the x-axis coordinate of the start point
    
    y0 - the y-axis coordinate of the start point
    
    x1 - the x-axis coordinate of the end point
    
    y1 - the y-axis coordinate of the end point
    
    Returns:
    
    a canvas gradient item
  - createPattern
```
@JsOverlay
public final CanvasPatternItem createPattern(Canvas canvas,
                                                        Repetition repetition)
```
    Creates a pattern using the specified canvas and repetition.
    
    Parameters:
    
    canvas - an canvas object
    
    repetition - a repetition object indicating how to repeat the pattern's image
    
    Returns:
    
    a canvas pattern item
  - createPattern
```
@JsOverlay
public final CanvasPatternItem createPattern(Img image,
                                                        Repetition repetition)
```
    Creates a pattern using the specified image and repetition.
    
    Parameters:
    
    image - an image object
    
    repetition - a repetition object indicating how to repeat the pattern's image
    
    Returns:
    
    a canvas pattern item
  - createRadialGradient
```
@JsMethod
public CanvasGradientItem createRadialGradient(double x0,
                                                         double y0,
                                                         double r0,
                                                         double x1,
                                                         double y1,
                                                         double r1)
```
    Creates a radial gradient using the size and coordinates of two circles.
    
    Parameters:
    
    x0 - the x-axis coordinate of the start circle
    
    y0 - the y-axis coordinate of the start circle
    
    r0 - the radius of the start circle. Must be non-negative and finite
    
    x1 - the x-axis coordinate of the end circle
    
    y1 - the y-axis coordinate of the end circle
    
    r1 - the radius of the end circle. Must be non-negative and finite
    
    Returns:
    
    a canvas gradient item
  - drawImage
```
@JsOverlay
public final void drawImage(Canvas canvas,
                                       double dx,
                                       double dy,
                                       double dWidth,
                                       double dHeight)
```
    Draws a canvas onto the canvas.
    
    Parameters:
    
    canvas - canvas instance to draw in the the context
    
    dx - the x-axis coordinate in the destination canvas at which to place the top-left corner of the source canvas
    
    dy - the y-axis coordinate in the destination canvas at which to place the top-left corner of the source canvas
    
    dWidth - the width to draw the canvas in the destination canvas.
    This allows scaling of the drawn canvas.
    If not specified, the canvas is not scaled in width when drawn
    
    dHeight - the height to draw the canvas in the destination canvas.
    This allows scaling of the drawn canvas.
    If not specified, the canvas is not scaled in height when drawn
  - drawImage
```
@JsOverlay
public final void drawImage(Canvas canvas,
                                       double dx,
                                       double dy,
                                       double dWidth)
```
    Draws a canvas onto the canvas.
    
    Parameters:
    
    canvas - canvas instance to draw in the the context
    
    dx - the x-axis coordinate in the destination canvas at which to place the top-left corner of the source canvas
    
    dy - the y-axis coordinate in the destination canvas at which to place the top-left corner of the source canvas
    
    dWidth - the width to draw the canvas in the destination canvas.
    This allows scaling of the drawn canvas.
    If not specified, the canvas is not scaled in width when drawn
  - drawImage
```
@JsOverlay
public final void drawImage(Canvas canvas,
                                       double dx,
                                       double dy)
```
    Draws a canvas onto the canvas.
    
    Parameters:
    
    canvas - canvas instance to draw in the the context
    
    dx - the x-axis coordinate in the destination canvas at which to place the top-left corner of the source canvas
    
    dy - the y-axis coordinate in the destination canvas at which to place the top-left corner of the source canvas
  - drawImage
```
@JsOverlay
public final void drawImage(Img image,
                                       double dx,
                                       double dy,
                                       double dWidth,
                                       double dHeight)
```
    Draws an image onto the canvas.
    
    Parameters:
    
    image - image instance to draw in the the context
    
    dx - the x-axis coordinate in the destination canvas at which to place the top-left corner of the source image
    
    dy - the y-axis coordinate in the destination canvas at which to place the top-left corner of the source image
    
    dWidth - 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
    
    dHeight - 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
  - drawImage
```
@JsOverlay
public final void drawImage(Img image,
                                       double dx,
                                       double dy,
                                       double dWidth)
```
    Draws an image onto the canvas.
    
    Parameters:
    
    image - image instance to draw in the the context
    
    dx - the x-axis coordinate in the destination canvas at which to place the top-left corner of the source image
    
    dy - the y-axis coordinate in the destination canvas at which to place the top-left corner of the source image
    
    dWidth - 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
  - drawImage
```
@JsOverlay
public final void drawImage(Img image,
                                       double dx,
                                       double dy)
```
    Draws an image onto the canvas.
    
    Parameters:
    
    image - image instance to draw in the the context
    
    dx - the x-axis coordinate in the destination canvas at which to place the top-left corner of the source image
    
    dy - the y-axis coordinate in the destination canvas at which to place the top-left corner of the source image
  - fill
```
@JsMethod
public void fill()
```
    Fills the current or given path with the current fill style.
  - fillRect
```
@JsMethod
public void fillRect(double x,
                               double y,
                               double width,
                               double height)
```
    Draws a rectangle that is filled according to the current fill style.
    This method draws directly to the canvas without modifying the current path, so any subsequent fill or stroke calls will have no effect on it.
    
    Parameters:
    
    x - the x-axis coordinate of the rectangle's starting point
    
    y - the y-axis coordinate of the rectangle's starting point
    
    width - the rectangle's width. Positive values are to the right, and negative to the left
    
    height - the rectangle's height. Positive values are down, and negative are up
  - fillText
```
@JsMethod
public void fillText(String text,
                               double x,
                               double y,
                               double maxWidth)
```
    Draws a text string at the specified coordinates, filling the string's characters with the current fill style.
    An parameter allows specifying a maximum width for the rendered text, which the user agent will achieve by condensing the text or by using a lower font size.
    
    Parameters:
    
    text - the string to render in the the context.
    The text is rendered using the settings specified by font, text align, text baseline, and direction.
    
    x - the x-axis coordinate of the point at which to begin drawing the text, in pixels
    
    y - the y-axis coordinate of the point at which to begin drawing the text, in pixels
    
    maxWidth - the maximum number of pixels wide the text may be once rendered.
    If not specified, there is no limit to the width of the text
  - fillText
```
@JsMethod
public void fillText(String text,
                               double x,
                               double y)
```
    Draws a text string at the specified coordinates, filling the string's characters with the current fill style.
    
    Parameters:
    
    text - the string to render in the the context.
    The text is rendered using the settings specified by font, text align, text baseline, and direction.
    
    x - the x-axis coordinate of the point at which to begin drawing the text, in pixels
    
    y - the y-axis coordinate of the point at which to begin drawing the text, in pixels
  - lineTo
```
@JsMethod
public void lineTo(double x,
                             double y)
```
    adds a straight line to the current sub-path by connecting the sub-path's last point to the specified (x, y) coordinates.
    
    Parameters:
    
    x - the x-axis coordinate of the line's end point
    
    y - the y-axis coordinate of the line's end point
  - measureText
```
@JsMethod
public TextMetricsItem measureText(String text)
```
    Returns a text metric item that contains information about the measured text.
    
    Parameters:
    
    text - the text to measure
    
    Returns:
    
    a text metric item
  - moveTo
```
@JsMethod
public void moveTo(double x,
                             double y)
```
    Begins a new sub-path at the point specified by the given (x, y) coordinates.
    
    Parameters:
    
    x - the x-axis (horizontal) coordinate of the point
    
    y - the y-axis (vertical) coordinate of the point
  - quadraticCurveTo
```
@JsMethod
public void quadraticCurveTo(double cpx,
                                       double cpy,
                                       double x,
                                       double y)
```
    Adds a quadratic Bézier curve to the current sub-path.
    It requires two points: the first one is a control point and the second one is the end point.
    The starting point is the latest point in the current path.
    
    Parameters:
    
    cpx - the x-axis coordinate of the control point
    
    cpy - the y-axis coordinate of the control point
    
    x - the x-axis coordinate of the end point
    
    y - the y-axis coordinate of the end point
  - rect
```
@JsMethod
public void rect(double x,
                           double y,
                           double width,
                           double height)
```
    Adds a rectangle to the current path.
    
    Parameters:
    
    x - the x-axis coordinate of the rectangle's starting point
    
    y - the y-axis coordinate of the rectangle's starting point
    
    width - the rectangle's width. Positive values are to the right, and negative to the left
    
    height - the rectangle's height. Positive values are down, and negative are up
  - restore
```
@JsMethod
public void restore()
```
    Restores the most recently saved canvas state by popping the top entry in the drawing state stack.
    If there is no saved state, this method does nothing.
  - rotate
```
@JsMethod
public void rotate(double angle)
```
    Adds a rotation to the transformation matrix.
    
    Parameters:
    
    angle - the rotation angle, clockwise in radians.
    You can use degree * Math.PI / 180 to calculate a radian from a degree.
  - save
```
@JsMethod
public void save()
```
    Saves the entire state of the canvas by pushing the current state onto a stack.
  - scale
```
@JsMethod
public void scale(double x,
                            double y)
```
    Adds a scaling transformation to the canvas units horizontally and/or vertically.
    
    Parameters:
    
    x - scaling factor in the horizontal direction.
    A negative value flips pixels across the vertical axis.
    A value of 1 results in no horizontal scaling
    
    y - scaling factor in the vertical direction.
    A negative value flips pixels across the horizontal axis.
    A value of 1 results in no vertical scaling
  - stroke
```
@JsMethod
public void stroke()
```
    Strokes (outlines) the current or given path with the current stroke style.
    Strokes are aligned to the center of a path; in other words, half of the stroke is drawn on the inner side, and half on the outer side.
  - strokeRect
```
@JsMethod
public void strokeRect(double x,
                                 double y,
                                 double width,
                                 double height)
```
    Draws a rectangle that is stroked (outlined) according to the current strokeStyle and other context settings.
    
    Parameters:
    
    x - the x-axis coordinate of the rectangle's starting point
    
    y - the y-axis coordinate of the rectangle's starting point
    
    width - the rectangle's width. Positive values are to the right, and negative to the left
    
    height - the rectangle's height. Positive values are down, and negative are up
  - strokeText
```
@JsMethod
public void strokeText(String text,
                                 double x,
                                 double y,
                                 double maxWidth)
```
    Strokes - that is, draws the outlines of - the characters of a text string at the specified coordinates.
    An optional parameter allows specifying a maximum width for the rendered text, which the user agent will achieve by condensing the text or by using a lower font size.
    
    Parameters:
    
    text - the text specifying the text string to render in the the context.
    The text is rendered using the settings specified by font, textAlign, textBaseline, and direction.
    
    x - the x-axis coordinate of the point at which to begin drawing the text
    
    y - the y-axis coordinate of the point at which to begin drawing the text
    
    maxWidth - The maximum width the text may be once rendered.
    If not specified, there is no limit to the width of the text.
  - strokeText
```
@JsMethod
public void strokeText(String text,
                                 double x,
                                 double y)
```
    Strokes - that is, draws the outlines of - the characters of a text string at the specified coordinates.
    
    Parameters:
    
    text - the text specifying the text string to render in the the context.
    The text is rendered using the settings specified by font, textAlign, textBaseline, and direction.
    
    x - the x-axis coordinate of the point at which to begin drawing the text
    
    y - the y-axis coordinate of the point at which to begin drawing the text
  - transform
```
@JsMethod
public void transform(double m11,
                                double m12,
                                double m21,
                                double m22,
                                double dx,
                                double dy)
```
    Multiplies the current transformation with the matrix described by the arguments of this method.
    This lets you scale, rotate, translate (move), and skew the context.
    
    Parameters:
    
    m11 - horizontal scaling. A value of 1 results in no scaling
    
    m12 - vertical skewing
    
    m21 - horizontal skewing
    
    m22 - vertical scaling. A value of 1 results in no scaling
    
    dx - horizontal translation (moving)
    
    dy - vertical translation (moving)
  - translate
```
@JsMethod
public void translate(double x,
                                double y)
```
    Adds a translation transformation to the current matrix by moving the canvas and its origin x units horizontally and y units vertically on the grid.
    
    Parameters:
    
    x - distance to move in the horizontal direction.
    Positive values are to the right, and negative to the left
    
    y - distance to move in the vertical direction.
    Positive values are down, and negative are up
  - getImageData
```
@JsMethod
public ImageData getImageData(double sx,
                                        double sy,
                                        double sw,
                                        double sh)
```
    Returns an ImageData object representing the underlying pixel data for a specified portion of the canvas.
    
    Parameters:
    
    sx - The x-axis coordinate of the top-left corner of the rectangle from which the ImageData will be extracted.
    
    sy - The y-axis coordinate of the top-left corner of the rectangle from which the ImageData will be extracted.
    
    sw - The width of the rectangle from which the ImageData will be extracted. Positive values are to the right, and negative to the left.
    
    sh - The height of the rectangle from which the ImageData will be extracted. Positive values are down, and negative are up.
    
    Returns:
    
    an ImageData object representing the underlying pixel data for a specified portion of the canvas.
  - putImageData
```
@JsMethod
public void putImageData(ImageData imagedata,
                                   double dx,
                                   double dy)
```
    Paints data from the given ImageData object onto the canvas.
    
    Parameters:
    
    imagedata - An ImageData object containing the array of pixel values.
    
    dx - Horizontal position (x coordinate) at which to place the image data in the destination canvas.
    
    dy - Vertical position (y coordinate) at which to place the image data in the destination canvas.

Class Context2dItem

Nested Class Summary

Nested classes/interfaces inherited from class org.pepstock.charba.client.dom.BaseEventTarget

Method Summary

Methods inherited from class org.pepstock.charba.client.dom.BaseHtmlElement

Methods inherited from class org.pepstock.charba.client.dom.BaseElement

Methods inherited from class org.pepstock.charba.client.dom.BaseNode

Methods inherited from class org.pepstock.charba.client.dom.BaseEventTarget

Methods inherited from class java.lang.Object

Method Detail

getCanvas

setFillColor

setFillColor

setFillGradient

setFillPattern

getFillColorAsString

getFillColor

getFillGradient

getFillPattern

getFont

setFont

setLineCap

getLineCap

getLineDashOffset

setLineDashOffset

setLineJoin

getLineJoin

getLineWidth

setLineWidth

setLineDash

setLineDash

getMiterLimit

setMiterLimit

getShadowBlur

setShadowBlur

getShadowColor

setShadowColor

getShadowOffsetX

setShadowOffsetX

getShadowOffsetY

setShadowOffsetY

setStrokeColor

setStrokeColor

setStrokeGradient

setStrokePattern

getStrokeColorAsString

getStrokeColor

getStrokeGradient

getStrokePattern

setTextAlign

getTextAlign

setTextBaseline

getTextBaseline

setGlobalCompositeOperation

getGlobalCompositeOperation

arc

arc

arcTo

beginPath

bezierCurveTo

clearRect

clip

closePath

createLinearGradient

createPattern

createPattern

createRadialGradient

drawImage

drawImage

drawImage

drawImage

drawImage

drawImage

fill

fillRect

fillText

fillText

lineTo

measureText

moveTo