SVG смущает 'fill' '' stroke-color '

У меня есть закрытый <path>, выполненный в форме звезды. Проблема проста, но расстраивает: когда я пытаюсь заполнить ее внутренности через атрибуты или CSS, единственное, что меняется, это цвет штриха. Я пристально смотрел на детали пути, но ничего особенного не видел. Даже самые основные руководства показывают, как заполнять замкнутые пути, поэтому это должно быть возможно.SVG смущает 'fill' '' stroke-color '

Here's a JSBin. Я прошу синий заполнить, но получить синий удар. Примечание. Я пытаюсь использовать оба шаблона от <defs> и эквивалент без шаблонов.

источник

2015-01-24 spamguy

что закрывает первый ''? –

Извините, редактирование goof: вытащил много нерелевантного контента. Исправлена и изменена ссылка JSBin. – spamguy

SVG работает правильно. Просто сама звезда ограничена этой группой. (Нет средней части вашей звезды для заполнения SVG, чтобы)

Изменение d атрибут к этому:

м 15.64,213.212 117.92,105.865 -33.174,154.959 с -1.035,4.834 0.876,9.824 4,876 , 12,729 3,999,2,906 9,335,3,181 13,613,0,704 л 137,124, -79,434 137,124,79,434 с 1,944 1,126 4,107,1,684 6,265,1,684 2,588,0 5,177, -0,802 7,348, -2,387 4, -92,906 5,911, -7,896 4,876, -12,729 L 378,44,319,07 496,359,213,212 c 3,679, -3,302 5,065, -8,462 3,538, -13,164 -1,528, -4,702 -5,683, -8,061 -10,6, -8,571 L 331,671,175,146 267,425,30,279 c -2,004, -4,519 -6,483, -7,432 -11,427, -7,432 -4,944,0 -9,423,2,914 -11,427,7,433 L 180,329,175,142 22,702,191,477 c -4,917,0,51 -9,072,3,869 -10,6,8,571 -1,528,4,702 -0,141,9,862 3.538,13.164 z

и вы должны увидеть, что я имею в виду

источник

2015-01-24 07:23:36 reabow

Я очень благодарен за исправление и прошу прощения за недостаток понимания, но что твой путь делает то, что раньше не делает? Пути, как я их понимаю, - это линии, а не определения пробелов. – spamguy

, так что у вас есть внешний путь и внутренний путь в вашем оригинале. Внутренний путь ограничивает форму от занимания средней части. Все, что я сделал, это взять векторную программу рисования (inkscape) и удалить внутренний путь, чтобы можно было заполнить внутренний раздел. То, что вам может не хватать, состоит в том, что «перо», которое рисует путь, может поднять и снова вернуться в другое место, чтобы снова начать рисовать. Путь - это не просто строка, а результирующий объект, который описывает набор строк. Я надеюсь, что это имеет смысл. – reabow

Возможно, более простое объяснение состоит в том, что то, что вы считали «инсультом», на самом деле не было штрихом. То, что у вас было, было синей звездой с чуть более маленькой звездообразной дырой. –

SVG смущает 'fill' '' stroke-color '

ответ

Смежные вопросы