ものづくり筆耕ものづくり筆耕ものづくりを楽しむ。皇帝ダリアの栽培からオリジナルシステムの構築まで。ものづくり筆耕ブログinventor図形などを回転ゲームを作るに当たり、テキストや図形を回転させます。これらを描画・表示するにはCanvasやenchant.jsを用いていましたが、漢字などの全角文字がきれいに表示されず悩んでいました。最近、それらのライブラリーを使わなくても図形を回転表示させることができましたので記録に残します。transform:rotateを使うcss3やHTMLのstyle属性にて、transform:rotate()を使えばオブジェクトを回転できます。svgやcanvasを使わずに2D(平面)方向に回転させます。>Rotated</div></body></html>電子福引き器を作るための準備いずれ、電子福引き器を作るに当たり、この方法を採用します。▶startボタンを押して実行してください。頃合いを見て⏹stopボタンを押せば回転は停止します。ガラガラを回転させる感覚でお楽しみください。製作上の誤差で回転軸が偏芯しています。お陰でもっともらしく臨場感あふれる出来栄えに仕上がりました。四隅(よすみ)の背景を取り除く画像は編集ソフトで作成しますが、丸いものでも長方形に作られます。丸い部分のみ表示させるには外の部分を透明色にすれば解決します。今回はフリーソフトpaint.netの魔法の杖で外部を選択してDELキーをクリックすれば透明色になります。コメントをキャンセル下記項目は必須ですがメールアドレスは公開されません。名前はニックネームをお使いください。コメント名前メールアドレス上に表示された文字を入力してください。コメントデータの処理方法の詳細はこちらをご覧ください。