fillText to add Text to Canvas




Drag the sliders to change the X, Y position of lineTo().
void gctx.fillText('text',x, y);
text: text string to display.
x: Position from left edge of the canvas,starting point of the text
y: Position from Top edge of the canvas, stating point of the text.
maxWidth: Optional, Font is adjusted to match the width.
var my_canvas=$('#my_canvas').get(0)
var gctx = my_canvas.getContext("2d");
gctx.font = '46px serif';
gctx.fillText('plus2net.com', 100,100);
fillStyle() can be used to add colour or colour gradient to rectangle, default is black.

Select two colours from this colour table ( click twice to select addColorStop 1 and addColorStop 2)

Start Colour End Colour

By adding colour gradient

var my_canvas=$('#my_canvas').get(0)
var gctx = my_canvas.getContext("2d");
my_gradient=gctx.createLinearGradient(100,100,380,130);
my_gradient.addColorStop(0,'#f50000');
my_gradient.addColorStop(1,'#69f5f5');
gctx.fillStyle=my_gradient;
gctx.font = '46px serif';
gctx.fillText('plus2net.com', 100,100);

Subscribe

* indicates required
Subscribe to plus2net

    plus2net.com




    Post your comments , suggestion , error , requirements etc here .




    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2024 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer