Страницы

Поиск по вопросам

понедельник, 10 июня 2019 г.

Возможно ли изменить ширину фигуры Svg ?

Вот SVG изображение. В нем я пытаюсь уменьшить ширину

Сниппет:


Ответ

Из вопроса непонятно, какую ширину вы хотите уменьшить:
Уменьшить ширину самой фигуры, но насколько уменьшить не ясно. Уменьшить ширину места, которое занимает svg внутри HTML?
Если первый вариант, то необходимо в векторном редакторе перерисовать фигуру нужной ширины и длины. Для этого откройте векторный редактор, установите размер документа близкий по размерам нужной вам фигуры и в границах этого документа нарисуйте нужную фигуру, стараясь оставлять минимальные отступы от границ документа. Фигура очень простая и это будет вам не трудно.
Если это второй вариант,- вы не хотите перерисовывать фигуру, но вам надо уменьшить слишком большие отступы от фигуры до краев SVG, то можно воспользоваться следующей техникой:
Вот ваш SVG, красная рамка показывает границы svg документа. Она добавлена стилями: style="border:1px solid red;"

Видно, что присутствуют очень большие отступы от фигуры до краев svg документа. Какого размера красная рамка, столько места svg займет в HTML. И никакие ухищрения в CSS не помогут уменьшить эти отступы. Уменьшать эти отступы нужно прямо в SVG. Для этого добавим viewport это width height в шапке svg файла. Если вам нужно адаптивное изображение, то ширину и высоту необходимо указывать в процентах.
Для уменьшения отступов меняем соотношение сторон,- делаем высоту в 8 раз меньше
376 /8 = 47px Точно такая же пропорция должна быть у viewport,- width="100" height="12.5%"

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

Комментариев нет:

Отправить комментарий