如何解决不能同时设置画布宽度和更改字体?
在jsfiddle中,调用measureText来设置画布宽度:
tCtx.canvas.width = tCtx.measureText(this.value).width;
覆盖字体大小:
tCtx.font = "25px serif"
如果我删除对 measureText 的调用,则画布将使用我期望的字体大小。不幸的是,我不得不猜测画布的宽度。为什么会这样,是否有更好的方法?
解决方法
更改画布尺寸也会重置上下文。调整大小后,您需要再次设置字体(以及任何其他非默认设置)。
tCtx.font = 'bold 24px serif';
tCtx.canvas.width = tCtx.measureText(this.value).width;
tCtx.font = 'bold 24px serif';
tCtx.fillText(this.value,10);
保存的状态(通过 .save()
/.restore()
)也会在调整大小时丢失。如果您希望对画布状态进行大量更改,您可能需要将这些更改为您自己的 .save()
/.restore()
函数。
只需将 tCtx.font 语句直接移动到 fillText 语句之前
tCtx.canvas.width = tCtx.measureText(this.value).width;
tCtx.font = 'bold 24px serif';
tCtx.fillText(this.value,10);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。