canvas text not showing? - javascript -

i using ctx.filltext function draw text onto screen , dosent seem appearing.

overlay("rgb(50, 50, 200)", "this beginning screen", 48, "black", "center", centerx, centery)  var overlay = function(colour, text, font, size, fontcolour, oreintation, x, y){     ctx.font = size + "px " + font + " " + fontcolour     ctx.textalign = oreintation     ctx.fillstyle = colour     ctx.fillrect(0, 0, ctx.canvas.width, ctx.canvas.height)     ctx.filltext(text, x, y) } 

still learning javascript dont downvote because noob :(

• you must define function var overlay before call `overlay(...);

• centerx & centery undefined

• the font face font missing overlay(...)

• the background fill same color text fill text not show

working demo:

var canvas=document.getelementbyid("canvas");  var ctx=canvas.getcontext("2d");  var cw=canvas.width;  var ch=canvas.height;      var overlay = function(colour, text, font, size, fontcolour, oreintation, x, y){    ctx.font = size + "px " + font + " " + fontcolour    ctx.textalign = oreintation    ctx.fillstyle = colour    ctx.fillstyle='gold';    ctx.fillrect(0, 0, ctx.canvas.width, ctx.canvas.height)    ctx.fillstyle=fontcolour,    ctx.filltext(text, x, y)  }    overlay(    "rgb(50, 50, 200)",     "this beginning screen",    'verdana',     48,     "black",     "center",     25,    50  );

body{ background-color: ivory; }  #canvas{border:1px solid red;}

<canvas id="canvas" width=300 height=300></canvas>