Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Menyimpan Kanvas sebagai Imej Menggunakan `canvas.toDataURL()`?

Bagaimana untuk Menyimpan Kanvas sebagai Imej Menggunakan `canvas.toDataURL()`?

Barbara Streisand
Lepaskan: 2024-11-04 08:30:30
asal
768 orang telah melayarinya

How to Save a Canvas as an Image Using `canvas.toDataURL()`?

Menyimpan Kanvas sebagai Imej Menggunakan canvas.toDataURL()

Mencipta aplikasi web selalunya memerlukan keupayaan untuk menyimpan kanvas sebagai imej. canvas.toDataURL() menyediakan kaedah untuk menukar elemen kanvas kepada URL data imej. Walau bagaimanapun, anda mungkin menghadapi masalah semasa menggunakan fungsi ini.

Satu masalah biasa ialah gagal menyimpan imej dengan betul. Untuk menyelesaikan masalah ini, pertimbangkan kod berikut:

<code class="js">function putImage() {
  var canvas1 = document.getElementById("canvasSignature");
  var ctx = canvas1.getContext("2d");

  // Change the format of the dataURL to "image/octet-stream" instead of "image/png".
  var myImage = canvas1.toDataURL("image/octet-stream").replace("image/png", "image/octet-stream");

  var imageElement = document.getElementById("MyPix");
  imageElement.src = myImage;
}</code>
Salin selepas log masuk

Dengan menukar format dataURL kepada "image/octet-stream", anda boleh memastikan imej itu boleh disimpan secara setempat tanpa ralat.

Atas ialah kandungan terperinci Bagaimana untuk Menyimpan Kanvas sebagai Imej Menggunakan `canvas.toDataURL()`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan