我正在使用 html canvas,但没有丰富的经验。我从文本区域获取文本并将其输出到 html Canvas 上。效果很好,但我很难用 Canvas 包含文本,而是它只是停留在一行上并超出 Canvas 区域。
我尝试使用 maxWidth 但这似乎不起作用,我想知道是否有人有任何想法或如何实现这一目标?
我已附上输入和当前得到的结果的屏幕截图。我尝试将其放在 jsfiddle 中,但由于某种原因它无法正常工作。如果有帮助的话,您可以在这里查看 - https://jsfiddle.net/whggn6vb/3/ 。下面是我用来在 Canvas 上绘制文本的主要函数。
function updateCanvas() {
var maxWith = canvas.width;
context.clearRect(0, 0, canvas.width, canvas.height);
context.drawImage(imageObj, 0, 0);
context.textAlign = "center";
context.font = "bold 36px Open Sans";
context.fillText($('#quottext').val(), canvas.width * 0.5, 100);
context.font = "14px Open Sans";
context.fillText($('#quotauthor').val(), canvas.width * 0.5, 200);
}
最佳答案
嗨,如果我的理解是正确的,你应该能够使用measureText()做你需要的事情
context.measureText(txt).width
如果你选择大字体,它会显示大
关于javascript - 在 HTML Canvas 中包含文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34182566/