html5中rotate()函数，旋转时，圆心在哪？怎么设置圆心位置？ 用setTransform()可以吗？还是translate()？

Question

比如 context.drawImage(img,20,100),
怎么能让img绕着（20，100）旋转？
求解！小弟再此拜谢啦...

Answer 1

的确
context.translate(圆心x, 圆心y);

接下来就是转圈
你要先设定一个转速时间例如 6000ms
再用自订 function animateRotate() 和 function draw()

animateRotate() {
// 这里写你想要的转圈效果
draw()
}

draw() {
context.translate(cx, cy);
context.rotate(Math.PI / 180) * 当每次转速时间 * 每角度
}

挺难说明的… 又不知道你画的 rect 是甚麼图形本回答被提问者采纳

Answer 2

jquery.rotate.js
绕中心点旋转：
obj.rotate({
angle: 90,
center: ["50%", "50%"]
});
绕左上角旋转：
obj.rotate({
angle: 0,
center: ["0", "0"]
});

Answer 3

别瞎折腾。。追问

这是什么意思？！不解...