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

Question

[miniven]

Ситуация такая: есть 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>

Comments

[dev-rob]

Вы inline подключаете svg?

Answer 1

[miniven]

Решил, просто указав нужный размер ViewBox

Answer 2

[Конан Варвар]

Предоставьте саму SVG.

Comments

[miniven]

Добавил в текст вопроса