The textBaseline property
The textBaseline property can be used to stipulate how text is vertically aligned
The textBaseline
property sets how any text that you draw on the
canvas is vertically aligned. By using this
property you can control the vertical alignment of whatever text you draw on to the
canvas. Remember that if
you set this property you may need to reset it or change when drawing subsequent
text.
Note that the bottom and ideographic may appear to be very similar in their positioning of the text.
Examples of setting the textBaseline property
These are the possible values for the setting. It should be noted that RGraph only uses three of these values - middle, top and bottom.
<script>
window.onload = function ()
{
var canvas = document.getElementById("cvs");
var context = canvas.getContext('2d');
context.textBaseline = 'top';
// context.textBaseline = 'hanging';
// context.textBaseline = 'middle';
// context.textBaseline = 'alphabetic';
// context.textBaseline = 'ideographic';
// context.textBaseline = 'bottom';
context.fillText('Some example text', 200, 25);
}
</script>