[ Leksykon ] [ JavaScript ] [ Metody ] [ Właściwości ] [ canvas ] [ CanvasRenderingContext2D ]
CanvasRenderingContext2D.shadowColor
[_] [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [K] [L] [M] [N] [O] [P] [Q] [R] [S] [T] [U] [V] [W] [X] [Y] [Z]
Przykłady:
<script>
window.onload = () => {
const szer = 600;
const wys = 300;
const canvas = document.getElementById("canvas");
canvas.width = szer;
canvas.height = wys;
const ctx = canvas.getContext("2d");
ctx.shadowColor = "red";
ctx.shadowBlur = 25;
ctx.miterLimit = 10;
ctx.lineWidth = 25;
ctx.lineJoin = "miter";
ctx.beginPath();
ctx.moveTo(25, 25);
ctx.lineTo(170, 110);
ctx.lineTo(450, 30);
ctx.lineTo(470, 100);
ctx.stroke();
ctx.lineWidth = 15;
["miter", "miter", "miter"].forEach((join, i) => {
ctx.miterLimit = 1;
ctx.lineJoin = join;
ctx.beginPath();
ctx.moveTo(10, 150 + i * 30);
ctx.lineTo(135, 195 + i * 30);
ctx.lineTo(175, 150 + i * 30);
ctx.lineTo(215, 195 + i * 30);
ctx.lineTo(455, 150 + i * 30);
ctx.stroke();
});
}
</script>
<canvas id="canvas" width="1" height="1"></canvas>
Opis:
Właściwość CanvasRenderingContext2D.shadowColor określa kolor cieni. Należy pamiętać, że na krycie renderowanego cienia będzie miało wpływ nieprzezroczystość koloru fillStyle podczas wypełniania oraz kolor strokeStyle podczas obrysowania. Cienie są rysowane tylko wtedy, gdy shadowColor właściwość ma ustawioną wartość nieprzezroczystą. Jedna z właściwości shadowBlur, shadowOffsetX, shadowOffsetY również musi być różna od zera. Wartość ciąg znaków przeanalizowany jako wartość CSS <color>. Wartość domyślna to całkowicie przezroczysty czarny.
Zobacz też:
fillStyle -
shadowBlur -
shadowOffsetX -
shadowOffsetY -
strokeStyle -