HTML5 キャンバスでチャート PoC を開発しています。
各テキスト AA、BB などはすべてキャンバスです。h でそれらを生成し、var canvas = $("<canvas></canvas>").appendTo(elementDiv);
ループを使用してテキストを表示しています。
ctx.fillText(txt, x - txt.length * 2, 18);
テキストを表示するために使用しています。
ここで、私の質問は、それらを縦書きにする方法です。
HTML5 キャンバスでチャート PoC を開発しています。
各テキスト AA、BB などはすべてキャンバスです。h でそれらを生成し、var canvas = $("<canvas></canvas>").appendTo(elementDiv);
ループを使用してテキストを表示しています。
ctx.fillText(txt, x - txt.length * 2, 18);
テキストを表示するために使用しています。
ここで、私の質問は、それらを縦書きにする方法です。
テキストを縦書きテキストに変換するには、rotate
メソッドを使用して、回転変換をキャンバスに適用するだけです。
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Transformations#Rotating
回転後にテキストを正しく配置するために変換が必要な場合もあります。translate
変換がどのように機能するかを理解するまで、変換をいじってみてください (行列がわかっている場合は、この手順をスキップできます)。