Heim > Web-Frontend > HTML-Tutorial > html5 canvas 画一个矩形,在矩形里添加文字。 文字超出矩形怎样自动换行???_html/css_WEB-ITnose

html5 canvas 画一个矩形,在矩形里添加文字。 文字超出矩形怎样自动换行???_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:15:05
Original
2663 Leute haben es durchsucht

   var canvas = document.getElementById("demo")   var ctx = canvas.getContext('2d');   ctx.font = "32pt Arial";   ctx.beginPath();   ctx.lineWidth = "1";   ctx.strokeStyle = "blue";   ctx.moveTo(100, 100);   ctx.lineTo(100, 400);   ctx.lineTo(400, 400);   ctx.lineTo(400, 100);   ctx.closePath();   ctx.stroke();   ctx.strokeText("hello world hello world hello world hello world hello world", 120, 200);   ctx.strokeStyle = "red";   ctx.stroke();
Nach dem Login kopieren

无法换行啊!!!
有什么方法可以换行???


回复讨论(解决方案)

CANVAS让文本自动换行恐怕是不可能的,因为绘制的文本和矩形没关系,
只有自己根据矩形,文本的大小和位置计算后,再绘制文本

计算文本占的宽度来换行
如果担心计算麻烦 可以用等宽的字体

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage