Есть текст
Hello заполненный градиентом (в роли градиента - картинка). Нужно сделать обводку этого текста Hello красным цветом.
Тень вроде работает нормально, градиент с картинки заполняется, а вот обводки не получается сделать никак.. Есть функция которая делает обводку
strokeStyle
Но она не работает и обводка не делается. В чем может быть проблема?
Я закоментировал эту строку которая должна сделать обводку, если откоментировать выпадает ошибка
|
Код:
|
Uncaught TypeError: context.strokeStyle is not a function |
Вот весь код.
|
Код:
|
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Canvas в HTML5</title>
</head>
<body>
<canvas id='test' width='1250px' height='600px'></canvas>
<script>
image = new Image()
var image = document.createElement('img'),
context = document.getElementById('test').getContext('2d');
image.onload = function() {
context.fillStyle = context.createPattern(image, 'no-repeat');
context.font = '200px Verdana'
//Окантовка для букв
context.fillText('Hello', 0, 300);
//Окантовка для букв
context.strokeText('Hello', 0, 300);
};
image.src = '1.jpg';
//Сдвиг тени право
context.shadowOffsetX = 50
//Сдвиг тени вниз
context.shadowOffsetY = 100
//размытость
context.shadowBlur = 15
context.shadowColor = 'brown'
//context.strokeStyle('red');
</script>
</body>
</html> |