Komentar: Anda perlu menggunakan bagian dari halaman web sebagai teks utama, ubah halaman web asli menjadi PDF sebagai lampiran, kirim email ke bos, ubah SVG menjadi kanvas untuk menampilkannya, tetapi kemudian menemukan bahwa kanvas tidak dapat menampilkannya secara normal, jadi pada akhirnya, Anda harus mengonversi tag kanvas ke dalam format gambar lagi gambar lagi gambar gambar gambar ke gambar gambar gambar gambar gambar ke gambar gambar gambar ke gambar gambar gambar ke gambar gambar gambar ke format gambar.
Baru -baru ini, ada kebutuhan untuk menempatkan bagian dari konten halaman web ke dalam teks utama, mengubah halaman web asli menjadi PDF sebagai lampiran, dan mengirim email ke bos. Karena kami adalah situs web tipe laporan, di HTML5, pengembangan kontrol tidak lebih dari kanvas atau SVG. Di sini kami memiliki beberapa kontrol yang menggunakan SVG, dan SVG tidak dapat ditampilkan secara normal di badan email Foxmail, jadi kami mempertimbangkan untuk mengonversi SVG menjadi kanvas untuk ditampilkan, tetapi kemudian kami menemukan bahwa kanvas tidak dapat ditampilkan secara normal. Pada akhirnya, kami tidak punya pilihan selain mengonversi tag kanvas ke format gambar lagi, yang akhirnya menyelesaikan masalah ini. Mari kita perkenalkan secara singkat proses implementasi di bawah ini. Berikut ini adalah tag SVG<div>
<svg> </svg>
</div>
Pertama, Anda perlu mendapatkan tag dan konten SVG:
var svghtml = svgcontainer.innerHtml ();
Mengonversi SVG ke kanvas membutuhkan canvg plugin Google. Anda dapat mengunduhnya di situs web resmi atau secara langsung merujuknya dari jarak jauh.
Selanjutnya, hubungi metode canVG (canvasid, svghtml) dari plug-in untuk mengonversinya ke kanvas. Parameter pertama dari metode ini adalah ID dari tag Canvas, dan yang kedua secara alami adalah konten tag SVG. Dengan cara ini, SVG dikonversi ke kanvas
Kemudian mengubah kanvas menjadi gambar, yang lebih mudah
var imgsrc = document.getElementById (canvasid) .todataurl (gambar/png); // Ini sebenarnya mengubah kanvas menjadi gambar dan mengembalikan semua data konten gambar, sebagai berikut untuk menampilkan gambar:
<img src = imgsrc />
Ini adalah cara mengimplementasikannya dari svg-> canvas-> gambar. Ini masih sangat berguna karena browser yang berbeda mendukung berbagai SVG dan kanvas. Dengan cara ini, setidaknya kontrol kami akan selalu dapat ditampilkan dengan benar, bahkan jika kami hanya dapat menggunakan gambar pada akhirnya.