HTML Canvas使用javascript旋转文本而不移动背景图像

Question

我正在使用画布进行一个小项目，简单地说就是把文字放在图像的顶部 有一个滑块可以改变位置和大小，但没有用于旋转文本 我一直在搜索stackoverflow，寻找一种方法来旋转文本而不影响背景图像，但是没有任何帮助。
我知道

 context.rotate( Math.PI / 2 );
 context.translate( canvas.width / 2, canvas.height / 2 );    

但这似乎是在旋转整个事情，包括背景。

有人能指出我正确的方向吗？ 链接到笔：

http://codepen.io/TryHardHusky/details/KdQQVq/

Answer 1

使用保存和恢复。

ctx.save(); // pushes canvas state onto a stack
// your text code
ctx.restore(); // pops the last save off the stack.

请记住，每次保存都必须进行还原。它们可以嵌套。它保存在一个堆栈中，意思是最后一次关闭。

或者你的情况稍快一点

// your text code
ctx.setTransform(1,0,0,1,0,0); // reset the transform to default;