Propriété shadowBlur du Canvas
Exemple
Dessinez un rectangle rouge avec une ombre noire et un niveau de flou de 20 :
JavaScript :
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.shadowBlur = 20;
ctx.shadowColor = "black";
ctx.fillStyle = "red";
ctx.fillRect(20, 20, 100, 80); Description
La propriété shadowBlur définit ou renvoie le niveau de flou des ombres.
La valeur par défaut est 0.
Voir aussi :
La propriété shadowColor (Définir la couleur de l'ombre)
La propriété shadowOffsetX (Définir la position x de l'ombre)
La propriété shadowOffsetY (Définir la position y de l'ombre)
La méthode fillRect() (Dessiner un rectangle rempli)
La propriété fillStyle() (Définir la couleur/style de remplissage)
Syntaxe
| context .shadowBlur = number |
Valeurs de propriété
| Valeur | Description | Jouez-le |
|---|---|---|
| number | Le niveau de flou de l'ombre |
Support des navigateurs
L'élément <canvas> est une norme HTML5 (2014).
shadowBlur est pris en charge dans tous les navigateurs modernes :
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Oui | Oui | Oui | Oui | Oui | 9-11 |