Skip to main content
Version: 9.0.2

canvas.drawText

canvas.drawText(text, attrs)

Draw a string within the canvas directed by the user-specified properties.

Parameters

ParameterTypeDescription
textstringThe text string to display.
attrsobjectAn object of properties containing information about how to draw the text.  See Draw Text Options below.

Draw Text Options

KeyTypeDescription
fontstringThe font to use to render the text (required, no default).
xnumberThe x position of the upper left corner of the image (default: 0).
ynumberThe y position of the upper left corner of the image (default: 0).
sizenumberThe point size to render the text at (default: 18).
colornumberThe color to render the text in (default: black: 0x000000).
rotationnumberThe angle in degrees to render the text at (default: 0).

Example

// Draw a hello world string centered on the canvas
function DrawCenteredText(name) {   
var msg = "Hello World";   
var canvas = sb.getCanvas(name);   
var attrs = {font : "fonts/RobotoBold.ttf", size : 24, x : 0, y : 0};   
var strSize = sb.getStringSize(attrs.font, attrs.size, msg, 0);   
attrs.x = (canvas.width - strSize.width) / 2;   
attrs.y = (canvas.height - strSize.height) / 2;   
canvas.drawText("Hello World", attrs);
}