JavaScript から canvas 要素に図を描く際、ブラウザが canvas 要素をサポートしているかどうかを判定したい場合があるでしょう。いくつかの方法がありますが、ここでは、シンプルな方法をご紹介します。
canvas 要素サポートの判定方法１
if ( window.HTMLCanvasElement ) {
// canvas 要素をサポートしている場合の処理
} else {
// canvas 要素をサポートしていない場合の処理
}
window.HTMLCanvasElement は、canvas 要素のオブジェクトの元となるオブジェクトです。canvas 要素をサポートしたブラウザであれば、このオブジェクトが存在します。
canvas 要素サポートの判定方法２
var canvas = document.getElementById('myCanvas');
if ( canvas.getContext ) {
var context = canvas.getContext('2d');
// canvas 要素をサポートしている場合の処理
} else {
// canvas 要素をサポートしていない場合の処理
}
または、getContext() メソッドの有無を調査することで、ブラウザが対応しているかどうかを確認できます。