javascript - Get the center of my text input in canvas -

I am trying to find the issue of my problem.

I have to write something in the canvas, and I would like to set x and y in the middle of the text and not from the beginning.

Imagine, you want to write 'Hello' in the center of the canvas.

In fact you ctx.fillText ("hello", canvas.witdh * 0.5, canvas.height * 0.5);

The problem here is that H is on the center, but not the rest.

Maybe I can center the text on the middle of the double 'll'?

Sometinh such as ctx.fillText ("hello" Canvas.witdh * 0.5- "Hello". Wide, canvas. * 0.5- "Hello". Height);

Thanks for the help.

Bits of your solution in every answer!

@Fawz correctly states that context.textAlign will automatically center your text horizontally.

@ user3190532 and @philip correctly say manual catering to calculate the width of context.measureText text.

I'm guessing font height for some slightly vertical focusing:

  var approxFontHeight = parseInt (ctx.font);  

Here is the example code and a demo:

  & lt ;; Doctype html & gt; & Lt; Html & gt; & Lt; Top & gt; & Lt; Link rel = "stylesheet" type = "text / css" media = "all" href = "css / reset.css" /> & Lt ;! - Reset CSS - & gt; & Lt; Script type = "text / javascript" src = "http://code.jquery.com/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Style & gt; Body {background color: ivory; } Canvas {boundary: 1 px solid red;}  gt; & Lt; / Canvas & gt; & Lt; / Body & gt; & Lt; / Html & gt;