タグ

ブックマーク / www.html5.jp (3)

  • fillText(), strokeText() メソッド - Canvasリファレンス - HTML5.JP

    構文 context . fillText(text, x, y [, maxWidth ] ) context . strokeText(text, x, y [, maxWidth ] ) 指定のテキストを指定の位置に、塗りつぶす、または、(個々に)輪郭描画します。最大幅が与えられると、そのテキストは必要に応じてそれにフィットするよう伸縮されるでしょう。 仕様 fillText() と strokeText() メソッドには、 text, x, y そして任意で maxWidth の3つ、もしくは4つの引数を与えます。そして、指定された text が指定された座標 (x, y) にレンダリングされます。もし maxWidth が引数に指定された場合は、それより決して横幅が広くならないようにレンダリングされます。 レンダリングの際には、現在の font, textAlign, textB

    a666666
    a666666 2013/06/06
  • 画像を組み込む - Canvas - HTML5.JP

    Canvasでは、JPEGやPNGといったブラウザに対応した画像であれば、それを組み込むことができます。このコーナーでは、画像の組み込み方法と、いくつかのオプション機能について紹介していきます。 画像組み込みの基 Canvasで画像を組み込むためには、drawImageメソッドを使います。与える引数に応じて、描画する画像の扱い方が違ってきます。 ctx.drawImage(image, dx, dy) ctx.drawImage(image, dx, dy, dw, dh) Canvasの座標 (dx, dy) を左上端として、image に格納されたImageオブジェクトを描画します。dw と dh が指定されると、画像は、dw を横幅、dh を縦幅としたサイズに伸縮されます。 ctx.drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh) 元

  • 独自データ属性 - グローバル属性 - HTML5 タグリファレンス - HTML5.JP

    3.2.5.9 data-* 属性を使った独自非表示データの組み込み 独自データ属性は、名前空間に属さない属性で、その名前は文字列 "data-" で始まり、ハイフンの後に少なくとも一文字が続きます。これは XML 互換で、ASCII 大文字 を含みません。 HTML ドキュメントの HTML 要素のすべての属性は自動的に小文字に変換されますので、ASCII 大文字に関する制約はこのようなドキュメントには影響を及ぼすことはありません。 独自データ属性は、適切な属性や要素がない場合に、ページやアプリケーションに固有の独自データを格納することを想定したものです。 これらの属性は、この属性を使うサイトと無関係のソフトウェアによる利用を想定していません。 例えば、音楽に関するサイトなら、各トラックの尺を含んだ独自データ属性を使って、アルバムのトラックを表すリスト項目を注記することができるでしょう。

  • 1