The built-in 2D rendering context for the drawing surface of a canvas.
- See:
-
CanvasRenderingContext2D at the Mozilla Developer Network.
Methods
-
dashedLineTo(fromX, fromY, toX, toY, pattern)
-
Deprecated since 7.4.0. Use native CanvasRenderingContext2D methods such as moveTo(), lineTo() and setLineDash() instead.
Dashed line polyfill for the canvas. Note that dashed lines are expensive operations when not supported natively. See external:CanvasRenderingContext2D#stxLine.
Parameters:
Name Type Description fromX
number Starting point of the X-axis.
fromY
number Starting point of the Y-axis.
toX
number Destination on the X-axis.
toY
number Destination on the Y-axis.
pattern
Array.<string> Array of stroke patterns.
- Deprecated:
-
As of 7.4.0. Use native CanvasRenderingContext2D methods such as moveTo(), lineTo() and setLineDash() instead.
Example
var canvas = stxx.chart.backgroundCanvas; var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.setLineDash([10, 10]); ctx.moveTo(0, canvas.height/2); ctx.lineTo(canvas.width, canvas.height/2); ctx.stroke();
-
stxCircle(x, y, radius, filled)
-
Deprecated since 7.4.0. Use native CanvasRenderingContext2D methods such as arc() instead.
Add native circle drawing to the canvas.
Parameters:
Name Type Description x
number X-axis position of the center of the circle.
y
number Y-axis position of the center of the circle.
radius
number Radius of the circle.
filled
boolean If true, then the circle is filled.
- Deprecated:
-
As of 7.4.0. Use native CanvasRenderingContext2D methods such as arc() instead.
Example
var canvas = stxx.chart.backgroundCanvas; var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.fillStyle = "red"; ctx.arc(canvas.width/2, canvas.height/2, 100, 0, 2 * Math.PI); ctx.fill();
-
stxLine(fromX, fromY, toX, toY, color, opacity, lineWidth [, pattern])
-
Deprecated since 7.4.0. Use native CanvasRenderingContext2D methods such as moveTo() and lineTo() instead.
Parameters:
Name Type Argument Description fromX
number Starting point of the X-axis.
fromY
number Starting point of the Y-axis.
toX
number Destination on the X-axis.
toY
number Destination on the Y-axis.
color
string CSS-compatible color, such as hex, rgb, rgba or even color names such as "orange".
opacity
number The alpha. A number between 0 and 1.
lineWidth
number The line width in pixels.
pattern
Array.<number> <optional>
An array that contains the number of pixels on and then the number of pixels off. For instance [1,1] would create a dotted pattern by turning one pixel on and then one pixel off repeatedly.
- Deprecated:
-
As of 7.4.0. Use native CanvasRenderingContext2D methods such as moveTo() and lineTo() instead.
Example
var canvas = stxx.chart.backgroundCanvas; var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.strokeStyle = "blue"; ctx.lineWidth = 2; ctx.moveTo(0, 0); ctx.lineTo(canvas.width, canvas.height/2); ctx.stroke();