ITの隊長のブログ

ITの隊長のブログです。Rubyを使って仕事しています。最近も色々やっているお(^ω^ = ^ω^)

canvasマスターのための第一歩のメモ

http://www.flickr.com/photos/47131321@N00/4268841912
photo by nidhug


ややこしいタイトルですね。


ちなみに使いづらくて、マスターはあきらめようかなと思っています。


本当にマスターになりたい人は、いますぐブラウザバックして、他の情報で勉強してください。


タイトルと温度差ありすぎだろ。って感じですが、せっかく試したのでメモです。

(function() {
        // canvasを使う
	var canvas = document.getElementById('sample');

	// canvasをサポートしていないブラウザはアラート
	if (! canvas.getContext){
		alert('現在利用しているブラウザでは、サービスは利用できません。');
		exit;
	}
	var context = canvas.getContext('2d');

	// imageオブジェクトを生成
	var img = new Image();

	// 画像の読み込み
	img.src = "image.ppg?" + new Date().getTime();

        // 画像を読み込まれるのを待ってから、読み込みを開始
	img.onload = function() {
		context.drawImage(img, 0, 0);
	}
}();
  • html
<canvas id="sample"></canvas>