Canvasを使うためのJavaScript入門

canvas要素を定める

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
canvas要素をbody要素の中に書くと、透明な矩形領域が定められ、JavaScriptで絵が描けます。
講師:
02:03

字幕

HTML5 でサポートされるようになった canvas 要素について説明します canvas というのは HTML5 で サポートされる矩形領域 四角の領域です その透明な領域には JavaScript を使って絵を描くことができます canvas 要素は 次のように定めます まず要素の canvas です そして id を定めると この id を JavaScript でとってきて コントロールすることができます それから 幅 width と 高さ height です そして canvas タグを閉じます html ドキュメントに canvas 要素を加えてみましょう body 要素に書き込みます ます canvas です それから id 属性 ここには JavaScript で コントロールするための名前を入れます myCanvas にしておきます それから 幅 width と 高さ height です タグを閉じて canvas 要素が入ります canvas 要素は先程言いました通り 透明の領域ですから このままブラウザで見ても 普通は何も見えません けれども スタイルシートを 加えておきました このスタイルシートでは canvas に 1px の 外枠を書くようにしてあります 色は黒です ですからブラウザで枠だけですが 確認することができます ブラウザで確かめてみましょう 「ファイル」メニューから 「ブラウザでプレビュー」をします 矩形領域 四角い外枠だけですけど canvas の領域が出来たことが確かめれました canvas 要素の定め方と canvas が できたことをブラウザで確かめました

Canvasを使うためのJavaScript入門

このコースでは幅広いJavaScriptの技術の中からCanvasを使うときに知っておかなければならない基本を手短に解説します。変数や関数といったプログラミングの基礎を学ぶところから、実際にCanvasへ簡単な描画を行うまでを説明します。

1時間25分 (12 ビデオ)
現在、カスタマーレビューはありません…
 

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。