Tasarım Kodlama

HTML5 Canvas Doğrusal Degrade Çizimi

HTML5 Canvas ile doğrusal bir degrade oluşturmak için createLinearGradient() yöntemini kullanabiliriz. Doğrusal degradeler, degradenin yönünü tanımlayan hayali bir çizgi ile tanımlanır. Degrademizi oluşturduktan sonra, addColorStop özelliğini kullanarak renkler ekleyebiliriz.

Doğrusal degradenin yönü, başlangıç noktasından createLinearGradient() ile tanımlanan hayali satırın bitiş noktasına gider. Bu derste iki renk durağı kullandık: degradenin başlangıç noktasında çıkan açık mavi ve bitiş noktasıyla biten koyu mavi. Renk durakları, hayali çizgi boyunca 0 ile 1 arasında bir yere yerleştirilir; burada 0, başlangıç noktasında ve 1, bitiş noktasındadır.

Çıktı:

Kod:

 

Çıktı 2:

Kod 2:

 

 

Yorum yap