SVG не работает

[manjey73]

<?xml version="1.0" standalone="no"?>
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 width height" preserveAspectRatio="none" vector-effect="non-scaling-stroke">
<mask id="msk">
<rect width="100%" height="100%" fill="white" rx="14" />
</mask> 
    <g fill="none" mask="url(#msk)" stroke="#000" stroke-width="6pt" >
	<rect x="0" y="0" width="100%" height="100%" rx="14"/>
    </g>
</svg>

Собственно код Рамки. Основан на примере Маскирования. То есть обрезки утолщения линии за пределы видимости.
rx надо одновременно менять в маске и в основном rect для изменения закругления.

Если надо сделать фон, то меняем тут g fill=»none» на свой цвет.

• Ответ изменён 1 год, 5 месяцев назад пользователем manjey73.

[Mikhail]

Но стоит его вставить в Редакторе, он ломается сразу же.

Он не отображается на форме предварительного просмотра? На самой схеме отображается?

[manjey73]

Ни в окне просмотра, ни на схеме не отображается. Смотрите на скрине фигура 2.
Там rect с использованием calc в расчете ширины и высоты от % общей ширины и высоты.
rect (line еще пробовал) просто игнорируется просмотрщиком и так же не вставляется.
Хотя окружность с + выставляется на картинке так же при помощи calc по центру, она при этом и отображается в просмотрщике и на web.

Вот хотелось бы, чтобы calc не убивался в редакторе в принципе, как для просмотра так и при вставке. Потому что проще пользоваться calc чем маскированием. Последнее то может быть не доступно для тех или иных вещей.

• Ответ изменён 1 год, 5 месяцев назад пользователем manjey73.

[manjey73]

Кстати скопировал со страницы код элемента и декодировал из base64 в svg.
Картинка в web прекрасно отобразилась вместе с функциями calc в элементе rect.

Печалька.

[manjey73]

Кажется я нашел причину проблемы, почему-то она проявляется при взаимодействии с неправильно написанным viewbox — он чувствителен к регистру и должно быть viewBox

[Mikhail]

Насколько я понял, с исправлением регистра viewBox проблема решилась.

[manjey73]

пока не проверил, но другой элемент, который делаю показал, что к регистру капризный.
Возможно ошибка была с этим и связана.
Сейчас попробую проверить и отпишусь.

[manjey73]

Нет, прямоугольник с заливкой все так же не рисуется.
Но там оказывается еще есть нюансы. По крайней мере в line можно добавлять calc и все работает и вставляется.
Потом еще поиграюсь для тестов

[Автор]

Записи