Javascript 在循环中平移和旋转画布

我在渲染多个画布块时遇到问题。我必须画一个矩形，并在该矩形内呈现逆时针旋转的文本。它在第一个街区内工作，但每一个街区都会导致奇怪的行为：

函数图（数据）{
const canvas=document.getElementById（“myCanvas”）；
if（canvas.getContext）{
函数绘制虚线（图案、x1、x2、y1、y2、颜色）{
ctx.beginPath（）；
ctx.setLineDash（模式）；
ctx.strokeStyle=颜色| |“黑色”；
ctx.lineWidth=4；
ctx.moveTo（x1，y1）；
ctx.lineTo（x2，y2）；
ctx.stroke（）；
}
常量绘图器=（x，y，datax）=>{
//PROD const assetnum=asset.ASSETSPEC.assetnum；
const assetname=“ASD”；
//常数tor=/tor./gi.test（资产名称）；
if（资产名称）{
//const torname=assetname.slice（3）；
ctx.setLineDash（[15,4,4,4,4,4]）；
ctx.lineWidth=3；
ctx.strokeStyle='#000'；
ctx.strokeRect（x，y，60，80）；
ctx.fillStyle=“黑色”；
ctx.font=“600 20px Arial”；
设text=ctx.measureText（assetname）；
ctx.save（）；
ctx.翻译（x+20，y+60+文本宽度/2）；
ctx.旋转（-0.5*Math.PI）；
ctx.fillText（资产名称，x，y）；
ctx.restore（）；
}
}
设c={
x:20，
y:20
};
数据=[“A”、“V”、“X”]
设ctx=canvas.getContext（“2d”）；
data.forEach（元素=>{
牵引器（c.x、c.y、元件组件）；
c、 y=c.y+90；
});
}否则{
警报（“不支持画布”）；
}
}
draw（）
文本呈现出现问题：

错：

ctx.fillText(assetname, x, y);

通过平移和旋转，我设置了文本渲染的起点，这就是为什么设置x，y而不是0,0是错误的

对:

ctx.fillText(assetname, 0, 0);