Spec-Zone.ru › Web APIs

CanvasRenderingContext2D: метод measureText()

Базовая линия Широко поддерживается

Эта функция хорошо отработана и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

  • Узнать больше
  • Полная совместимость
  • Отправить отзыв

Метод CanvasRenderingContext2D.measureText() возвращает объект TextMetrics, содержащий информацию о измеренном тексте (например, его ширину).

Синтаксис

measureText(text)

Параметры

text

Строка текста для измерения.

Возвращаемое значение

Объект TextMetrics.

Примеры

При данном элементе <canvas>:

<canvas id="canvas"></canvas>

… вы можете получить объект TextMetrics с помощью следующего кода:

const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let text = ctx.measureText("Hello world");
console.log(text.width); // 56;

Спецификации

Спецификация
HTML
# dom-context-2d-measuretext-dev

Совместимость с браузерами

Рабочий стол Мобильные устройства
Chrome Edge Firefox Opera Safari Chrome Android Firefox для Android Opera Android Safari в IOS Samsung Internet WebView Android
measureText 2 12 3.5 ≤12.1 4 18 4 ≤12.1 3.2 1.0 ≤37

См. также

  • Интерфейс, определяющий этот метод: CanvasRenderingContext2D
  • TextMetrics

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/measureText

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API