SVGが正しく表示されない、iOS Safari

Question

私はSVG1.1として切り取って保存した.ai形式のウェブサイトのロゴを提供し、これを友人のShopifyストアの複数の場所に配置しました。

Image in question（iOS用のSafariでこれを見る）サイト上の画像不良の

スクリーンショット：ここでは実際のページへi.stack.imgur.com/HmsIB.png

リンク：bambooboss .com/pages/about-us

最初の写真の下の「パンダヘッド」画像は、iPhone 5の最新バージョンのSafariで見たときに半分黒く塗りつぶされています。私の友人の独創的なビジョンのように...

しかし無駄に...

誰もが何が起こっているの手掛かりを持っている -

私はSO、彼らは私が現在の画像にした<defs>タグを持つすべてのLinearGradientを、周囲しようとしたところに別の答えhereを試してみましたか？それは互換性ですか？または.aiからSVGに保存している間に何か問題が起きましたか？

Answer 1

変更するには、次の行に：

.st38{opacity:.08;fill:url(#XMLID_108_);} 

すなわちSVGOMGのようなオプティマイザを介してこれを実行する...小さいサイズで表示されている場合、これはある...また8.00000e-02

を削除はるかに複雑で大きい。すべてのグラデーションを単純化し、それらをすべて1つに統合することもできます。 ungzippedバージョンを35kbから桁違いに下げることができるはずです。ラブリーロゴ。