Artikel Pengenalan Wulin.com (www.vevb.com): Aplikasi HTML5 Daily Training Canvas Tag - Menggambar grafik gradien radial.
Kami belajar cara menggambar grafik gradien linier menggunakan kanvas, dan hari ini kami akan belajar cara menggambar grafik gradien radial. Melalui studi kelas sebelumnya, kita tahu bahwa menggambar grafik gradien linier menggunakan fungsi yang sangat penting - createLineArgradiEend ();
Jika kami ingin menggambar gradien radial, kami memiliki metode yang sama sebagai berikut:
xStart: Sumbu horizontal dari titik awal gradien
YSTART: Koordinat vertikal dari titik awal gradien
Xend: Sumbu horizontal titik akhir gradien
Yend: Koordinat vertikal dari titik akhir gradien
Radiusstart: Jari -jari lingkaran yang mulai berubah
Radiusend: Jari -jari lingkaran yang berakhir dengan gradien
Akhirnya, kita dapat menggambar gradien yang sangat indah melalui metode AddColorstop yang kita pelajari di kelas terakhir. Ini juga perlu mengatur angka titik mengambang antara 0-1 sebagai offset dari titik balik gradien.
Seluruh kode kasus sama seperti di kelas sebelumnya, kecuali: