在Html5畫布中顯示上下顛倒的文本

Question

如何在html5畫布中顯示顛倒的文本？如果你能提供一個示例工作代碼，這將有很大的幫助。 :)

Answer 1

您需要使用rotate轉型。你可以閱讀更多關於它在這裏： https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Transformations

代碼示例：

var ctx = document.getElementById('canvas').getContext('2d'); 
ctx.translate(100,100); 
ctx.save(); 
ctx.rotate(Math.PI); 
ctx.fillText("TEST", 10, 10); 
ctx.restore(); 

http://jsfiddle.net/uyLNr/

Answer 2

這應該做工精細 http://www.codeproject.com/Tips/166266/Making-Text-Upside-down-using-CSS