複数の SVG を 1 つに結合したい。私の現在の解決策は次のようなものです：
<svg>
<svg>...</svg>
<svg>...</svg>
<svg>...</svg>
</svg>
これは、viewBox や size などを要素ごとに個別に使用できるため、非常に便利です。しかし、そのファイルを Inkscape で編集しようとすると、要素がジャンプしてサイズが変わっているように見えます。
各 svg をグループ要素に変換することを考えましたが、viewBox、サイズ、および位置 (親に対して) を手動で適用する必要があるため、方法がわかりません。
これを行うための提案はありますか？
このようなファイルの例を次に示します。
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1680" height="966">
<svg contentScriptType="text/ecmascript" zoomAndPan="magnify" contentStyleType="text/css" id="965194" version="1.1" width="325" preserveAspectRatio="xMidYMid meet" viewBox="426 337 1031 992" height="312" x="666" y="179">
<rect x="426" stroke-linecap="round" y="337" transform="matrix(1.0,0.0,0.0,1.0,0.0,0.0)" fill="none" width="1031" id="52872" height="992" stroke="#000000" stroke-width="10"/>
</svg>
<svg contentScriptType="text/ecmascript" zoomAndPan="magnify" contentStyleType="text/css" id="346790" version="1.1" width="150" preserveAspectRatio="xMidYMid meet" viewBox="28 58 445 470" height="159" x="760" y="257">
<ellipse stroke-linecap="round" transform="matrix(1.0,0.0,0.0,1.0,0.0,0.0)" fill="none" rx="212.5" cx="250.5" ry="225.0" id="89340" cy="293.0" stroke="#000000" stroke-width="10"/>
</svg>
<svg contentScriptType="text/ecmascript" zoomAndPan="magnify" contentStyleType="text/css" id="342294" version="1.1" width="780" preserveAspectRatio="xMidYMid meet" viewBox="115 363 1665 1461" height="684" x="413" y="2">
<rect x="115" stroke-linecap="round" y="363" transform="matrix(1.0,0.0,0.0,1.0,0.0,0.0)" fill="none" width="1665" id="74016" height="1461" stroke="#000000" stroke-width="10"/>
</svg>
</svg>