Как я могу создать эффект тени полностью по всем сторонам, кроме вершины холста? - PullRequest
Новая
       0

Как я могу создать эффект тени полностью по всем сторонам, кроме вершины холста?

0 голосов
/ 04 мая 2019

Есть ли способ получить эффект размытия слева, справа и снизу, но не сверху оранжевой фигуры в прилагаемом коде? Я попытался использовать shadowOffsetY, но это также сдвигает тень левой и правой сторон.

Мне нужно, чтобы тень проходила по всей длине всех сторон, кроме вершины. 

<!DOCTYPE html>
<html>
<head>
</head>
<body>

  <canvas id="myCanvas" width="200" height="200" style="border:1px solid #000000;">
  </canvas>
  </body>
<script>
  var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "orange";
ctx.shadowBlur = 10;
ctx.shadowColor = "black";
ctx.fillRect(20,20,75,75);
  </script>
</html>

1 Ответ

1 голос
/ 04 мая 2019

Не очень умно, но: 

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <canvas id="myCanvas" width="200" height="200" style="border:1px solid #000000;">
        </canvas>
        <script>
            var canvas = document.getElementById("myCanvas");
            var ctx = canvas.getContext("2d");
            ctx.fillStyle = "orange";
            ctx.shadowBlur = '10';
            ctx.shadowColor = "black";
            ctx.fillRect(20,20,75,75);
            ctx.fillStyle = "white";
            ctx.shadowBlur = '0';
            ctx.shadowColor = "none";
            ctx.fillRect(10, 5, 95, 15);
         </script>
    </body>
 </html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...