Градиентная заливка SVG не работает

Я пытаюсь добавить градиентный фон к пути SVG. Вместо этого путь черный. Это код, который у меня есть:

<svg style="overflow: hidden; position: relative; " height="150" version="1.1" width="290" xmlns="http://www.w3.org/2000/svg">
...
    <defs style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); ">
        <lineargradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
            <stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1"></stop>
            <stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1"></stop>
        </lineargradient>
    </defs>
    <path style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); " fill="url(#grad1)" stroke="none" d="M100,114L74,114L74,83L100,83Z"></path>
...
</svg>

Что мне не хватает?

Спасибо


svg
person Miki    schedule 04.06.2012    source источник


Ответы (1)


В linearGradient есть заглавная буква G. В приведенном выше фрагменте это lineargradient.

person Robert Longson    schedule 04.06.2012