Easy-Micro


LANGAGE HTML5 CANVAS
Dégradés

Canvas avec des dégradés de couleur

Pour réaliser des dégradés, on utilise soit :
  • les dégradés linéaire (createLinearGradient) le long d'un axe
  • les dégradés radial (createRadialGradient) avec un centre et une extension circulaire




<canvas id="monCanvas" width="200" height="100" style="border:1px solid #000000;"></canvas>

<script type="text/javascript">
var c = document.getElementById(" monCanvas ");
var ctx=c.getContext('2d');

var gradient = ctx.createLinearGradient(50,50,250,250);
gradient.addColorStop(0,"blue"); // Départ
gradient.addColorStop(0.8,"yellow"); // Intermédiaire
gradient.addColorStop(1,"green"); // Arrivée
ctx.fillStyle = gradient; // Affectation au remplissage
ctx.fillRect(0,0,c.width,c.height);
<:/script>

Pour aller plus loin...


Suivez les aventures des skippers aquitains sur EasyVoile.com
Flux RSS Easy-Micro - Abonnez-vous Easy-Micro [ François Bisch ]
Jeudi 17 janvier 2019 - Semaine 03 - Sainte Roseline (Demain: Sainte Prisca)
Aujourd'hui, c'est l'anniversaire de Françoise Hardy (1944-75 ans), chanteuse française (1962: Tous les garçons et les filles) et de Dalida (1933-1987), chanteuse et actrice française. Autre 17 janvier: 1706 - Naissance de Benjamin Franklin (mort le 17 avril 1790).
Haut de page Easy-Micro