Adobe Illustratorで単純なSVGを保存するのに本当に問題があります。
Illustratorは、独自のキャンバスサイズをエクスポートに課し続けます。
これは私がやっていることです...
1)画像の周りにアートボードを描きます
2)ファイル>名前を付けて保存
3)タイプをSVGに変更します
結果を見ると、Illustratorがキャンバスのサイズを任意に変更しているようです
これを制御して自分のサイズを取得するにはどうすればよいですか?
問題は、SVGがデフォルトのドキュメントサイズに設定されているArtboardと共に保存されていることです。
保存する前に、「オブジェクト」>「アートボード」>「アートワークの境界に合わせる」を使用してみてください。
Mac Finder(SVGの表示に使用していると想定しています)は、SVG境界を無視する傾向があります。フォルダでそれらを表示しているときは少し面倒ですが、本番環境では問題になりません。
開始タグに特に注意して、テキストエディターでSVGファイルを開きます。 「viewbox」属性のデカルト座標があなたが考えているものと一致することを確認してください。
コードの意味の詳細な説明: http://commons.oreilly.com/wiki/index.php/SVG_Essentials/Coordinates
Illustratorには、アートボード、つまり.svg形式の「viewBox」に関する問題があります。これを試してください。まず、Illustratorでグラフィック用にアートボード/キャンバスを調整してから、ファイルを.ai形式で保存します。
これで、.ai形式からファイルを.svgとして保存でき、アートボードは調整したとおりになります。次回Illustratorで.svgを開くと、アートボードが再び混乱するため、.aiファイルから作業し、Webで.svgを使用する必要があります。
つまり、.svgを調整する必要があるたびに、最初に.ai形式で保存し、アートボードを調整して、.aiとして保存し、次に.svgとして保存する必要があります。
アドビの担当者への連絡先アドレスがある場合は、アドビの担当者に知らせてください...
場合によっては、図にサイズを大きくする小さなアイテムを誤って含めることがあります。 Crtl + Aを押して、ドキュメント内のすべてをハイライトしてみてください。次に、図の外にある余分なアイテムを削除します。これでキャンバスのサイズが変更されます。
これに対する解決策は https://petercollingridge.appspot.com/svg-editor のようなオプティマイザを使用することです
これにより、空白が取り除かれ、ファイルも最適化されます。