ホームページ  >  記事  >  ウェブフロントエンド  >  データ URL を HTML5 キャンバスに画像として描画します

データ URL を HTML5 キャンバスに画像として描画します

WBOY
WBOY転載
2023-09-17 23:33:151129ブラウズ

データ URL を HTML5 キャンバスに画像として描画します

データ URL がある場合は、キャンバス上に画像を作成できます。これは、次のコード スニペットに示すように実行できます。

var myImg = new Image;
myImg.src = strDataURI;

drawImage() メソッドは、画像、キャンバス、またはビデオをキャンバスに描画します。また、drawImage() メソッドは、画像の一部を描画したり、画像サイズを拡大/縮小したりすることもできます。

以下に示すコードは、このシーケンスでも機能します - イメージを作成し、新しいイメージを使用するように onload を設定し、次に src を設定します -

// load image from data url
Var Obj = new Image();
Obj.onload = function() {
   context.drawImage(myImg, 0, 0);
};
Obj.src = dataURL;

以上がデータ URL を HTML5 キャンバスに画像として描画しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。