@miniven

Как сделать SVG элемент адаптивным?

Ситуация такая: есть SVG элемент, содержащий несколько дочерних элементов. Все они расположены в соответствии с конкретными координатами. Как сделать так, чтобы при уменьшении контейнера, дочерние элементы SVG элемента перемещались на новые координаты, как если бы они были указаны в процентах. Может нужно как-то систему координат уменьшать? Возможно ли вообще такое сделать? Спасибо

<svg id="world-svg" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" class="world__svg" xmlns:svgjs="http://svgjs.com/svgjs">
  <rect id="SvgjsRect1007" width="22" height="22" shape-rendering="crispEdges" fill-opacity="0" fill="#ffffff" x="615" y="130" stroke="red" stroke-width="1" style="cursor: pointer;"></rect>
  <rect id="SvgjsRect1008" width="18" height="18" shape-rendering="crispEdges" fill-opacity="0" fill="#ffffff" x="524" y="211" stroke="red" stroke-width="1" style="cursor: pointer;"></rect>
  <rect id="SvgjsRect1009" width="18" height="18" shape-rendering="crispEdges" fill-opacity="0" fill="#ffffff" x="551" y="170" stroke="red" stroke-width="1" style="cursor: pointer;"></rect>
  <rect id="SvgjsRect1010" width="18" height="18" shape-rendering="crispEdges" fill-opacity="0" fill="#ffffff" x="571" y="182" stroke="red" stroke-width="1" style="cursor: pointer;"></rect>
</svg>
  • Вопрос задан
  • 306 просмотров
Решения вопроса 1
@miniven Автор вопроса
Решил, просто указав нужный размер ViewBox
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
JaredWinter
@JaredWinter
Помог? - Отметь решением.
Предоставьте саму SVG.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы