--- title: CanvasRenderingContext2D.fillText() slug: Web/API/CanvasRenderingContext2D/fillText translation_of: Web/API/CanvasRenderingContext2D/fillText ---
Метод CanvasRenderingContext2D
.fillText(),
предоставляемый Canvas 2D API, рисует (заливает) заданный текст в заданной позиции (x, y). Если указан необязательный четвертый параметр, текст будет масштабироваться в соответветствие с указанной максимальной шириной.
См. также метод {{domxref("CanvasRenderingContext2D.strokeText()")}} для выполнения обводки текста.
void ctx.fillText(text, x, y [, maxWidth]);
text
x
y
maxWidth
{{optional_inline}}Ниже представлен простой фрагмент кода, использующий fillText.
<canvas id="canvas"></canvas>
var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); ctx.font = "48px serif"; ctx.fillText("Hello world", 50, 100);
Вы можете редактировать код, представленный ниже, и сделанные вами изменения отобразятся на холсте в режиме реального времени:
{{ EmbedLiveSample('Playable_code', 700, 360) }}
Спецификация |
Статус | Комментарий |
---|---|---|
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-filltext", "CanvasRenderingContext2D.fillText")}} | {{Spec2('HTML WHATWG')}} |
{{ CompatibilityTable() }}
Возможность | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Базовая поддержка | {{ CompatVersionUnknown() }} | {{ CompatGeckoDesktop("1.9.1") }} | {{ CompatIE(9) }} | {{ CompatVersionUnknown() }} | {{ CompatVersionUnknown() }} |
Возможность | Android | Chrome для Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Базовая поддержка | {{ CompatVersionUnknown() }} | {{ CompatVersionUnknown() }} | {{ CompatGeckoMobile("1.9.1") }} | {{ CompatVersionUnknown() }} | {{ CompatVersionUnknown() }} | {{ CompatVersionUnknown() }} |