46 ini memiliki type="button" dan id="dw" yang mana button ini kita beri nama Download Image. Setelah button dan canvas tersedia, kita mulai menggambar terlebih dahulu pada canvas, dimana pada contoh ini kita gunakan gambar yang ada materi menggambar persegi. Disini kita gunakan dua model persegi yang satunya menggunakan fill dan yang satu lagi menggunakan strok serta jangan lupa kita berikan Style dimana pada contoh kita gunakan warna merah dan green. Pada code ini kita juga tambahkan fungsi const btndownload = document.querySelector("#dw"); untuk inisialisasi javascrip dari button Download Image pada html yang sudah kita sediakan. Lanjut kita membuat aksi ketika button tersebut di klik dengan cara menggunakan code btndownload.addEventListener("click", function () { … } dimana perintah ini akan menjalankan proses pada kuring kerawal jika btndownload di klik. Jika button yang kita sediakan ada aksi maka langkah awal yang harus kita buat adalah sebuah elemen baru yang diberi nama a seperti const a = document.createElement('a'); dan document.body.appendChild(a);. Kemudian kita akan mengambil data URL dari canvas dengan tipe jpg a.href = canvas.toDataURL("image/png", 0.1); dan simpan file jpg dengan nama yang sudah kita tentukan seperti code a.download = "canvaskotak.png";. Selanjutnya kita tambahkan aksi a.click(); dan jika
RkJQdWJsaXNoZXIy MTM3NDc5MQ==