Bagaimanakah Saya Boleh Menyimpan Kanvas HTML sebagai Imej PNG?

Merakam Output Kanvas HTML sebagai Pelbagai Format Imej

Soalan:

Bolehkah kandungan kanvas HTML ditangkap atau dicetak sebagai imej atau PDF? Secara khususnya, bagaimanakah imej boleh dijana daripada kanvas dan disimpan sebagai PNG?

Jawapan:

Menggunakan ciri lanjutan HTML5, menangkap dan menyimpan output kanvas sebagai imej telah menjadi proses yang mudah:

const canvas = document.getElementById('mycanvas');
const img = canvas.toDataURL('image/png');

Setelah data imej yang dikehendaki disimpan dalam img pembolehubah, ia boleh digunakan dalam pelbagai cara:

• Jana imej baharu:

document.getElementById('existing-image-id').src = img;

• Paparan terus dalam HTML:

document.write('<img src="' + img + '" />');

Skrip ini membolehkan anda menangkap dan menyimpan output kanvas sebagai imej PNG, menyediakan kaedah yang mudah untuk kegunaan atau pengedaran selanjutnya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyimpan Kanvas HTML sebagai Imej PNG?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!