Canvas 中 fillText 如何旋转角度

想要实现文字按自身旋转90度单独写this.context.fillText(this.appearanceBean.length, w * 0.28, h * 0.87)可以展示文字,但是添加this.context.rotate(90 * Math.PI/180)后文字就消失了 并没有实现我想要的效果。

HarmonyOS
2024-09-23 14:00:35
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zxjiu

rotate旋转是以左上角坐标(0,0)为原点顺时针开始旋转,原有fillText的内容以(0,0)为原点旋转90度后会展示在屏幕外,此时y轴坐标需要调整为负值,并且x轴和y轴坐标对调,才会在页面展示。需要根据旋转角度调整x轴和y轴坐标,才能保持元素在页面相对位置不会改变。例如:

this.context.fillText(this.appearanceBean.length, h * 0.8 , -w * 0.28)
分享
微博
QQ
微信
回复
2024-09-23 17:25:25
相关问题
HarmonyOS 如何获取屏幕旋转角度
348浏览 • 1回复 待解决
HarmonyOS 图片旋转角度问题
280浏览 • 1回复 待解决
HarmonyOS 如何停止无限旋转的动画
290浏览 • 1回复 待解决
HarmonyOS 如何获取图片的角度
253浏览 • 1回复 待解决
Canvas深色/浅色主题切换
901浏览 • 1回复 待解决
JS UI框架canvas如何动态指定宽高
7364浏览 • 1回复 待解决
如何实现图片裁剪、旋转
955浏览 • 1回复 待解决
HarmonyOS 关于canvas 动态设置lineto
275浏览 • 1回复 待解决