Canvas テキストのお試し
今週少しずつ進めている HTML5 Canvas、 3章「テキスト」でテキストアレンジャーというのものを作った。
で、章の終わりで完成したものをサンプルとして残しておくだけでも良かったんだけど、できたものを使っていると楽しくなってきたので、レイアウトを最低限整えてみたり背景の色も変えれるようにしてみた。
あと、テキストアレンジャーを作ってる途中に透明度の指定がうまく反映されないことがあったんだけど、これはテキストの透明度の値が背景にも影響されてたからっぽい。背景に context.globalAlpha = 1
を指定するとちゃんと予期した通りの表示になった。
- 修正前: http://jsfiddle.net/thleap/bhoyhh39/ ... Alpha バーを途中どこかで止めながら 1 ~ 0 に近づけた時(途中 0.5 などでバーを止めた時)、0 になってもテキストが完全な透明にならない。
- 修正後: http://jsfiddle.net/thleap/bhoyhh39/1/
JSFiddle は編集画面の URL の末尾に show
を加えると結果をフル画面表示にできて、jsdo.it は fullscreen
を加えるとフル画面にできる。忘れがち。