Захватите ширину того, что написано на изображении холста

JsFiddle: http://jsfiddle.net/K34a7/ Я создаю отделение и сохраняю образ в нем. Я хочу знать, как обнаружить ширину части, написанной по изображению так, чтобы я мог динамично назначить размер ширины отделения а не целого изображения?

document.getElementById('text').addEventListener('keyup', function (){
tCtx.canvas.width = tCtx.measureText(this.value).width;
var t = this.value.split('\n');
tCtx.canvas.height = t.length*10;

console.log(t);
var y = 10;
for(var i=0; i
0
nl ja de
Возможный дубликат: stackoverflow.com/questions/10099226/…
добавлено автор devnull69, источник

1 ответы

Вы уже используете measureText в вашем коде. Просто добавьте ссылку на ширину как так

var textWidth = tCtx.measureText(this.value).width;

textWidth will contain the width of the text on the canvas.

Демонстрационный пример

1
добавлено
Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda

CSS — русскоговорящее сообщество
CSS — русскоговорящее сообщество
1 502 участник(ов)

Сообщество любителей CSS Возникли проблемы с CSS? – пиши сюда, обсудим и предложим самое лучшее решение Работа: @css_ru_jobs Правила: https://teletype.in/@css_ru/r1EWtQ2w7 Приходите в наши чаты @javascript_ru и @frontend_ru Флуд: @css_flood

Чат — Типичный Верстальщик
Чат — Типичный Верстальщик
1 080 участник(ов)

Основной канал: @tpverstak Обратная связь: @annblok Все ссылки на соц.сети проекта: http://taplink.cc/tpverstak ПРАВИЛА ЧАТА — https://teletype.in/@annblok/BygPgC3E7

Веб-Технологи: UI/UX, Вёрстка, Фронтенд
Веб-Технологи: UI/UX, Вёрстка, Фронтенд
167 участник(ов)

Всё про веб-дизайн и вёрстку. А также: HTML, CSS, флекс и бутстрапы, шаблонизаторы, препроцессоры, методологии, аглифаеры, улучшаторы и обфускаторы. Обсуждаем темы юзабилити, устраиваем А/В тесты лендингов, и проводим аудит.

DTP :: @DTPublish
DTP :: @DTPublish
147 участник(ов)

Обсуждаемые темы: полиграфия, препресс, верстка, дизайн, иллюстрации, скрипты, плагины. Канал - @DTPublishing

css_jobs
css_jobs
26 участник(ов)

Чат для вопросов по css и html: @css_ru Флуд: @css_flood Канал с вакансиями и резюме: @css_jobs_feed

css_флуд
css_флуд
10 участник(ов)