एसवीजी सफारी

Question

में आईएमजी टैग में प्रदर्शित नहीं होता है बस, मेरे पास HTML में एम्बेडेड एक एसवीजी ग्राफ़िक है जो सफारी में प्रदर्शित करने से इंकार कर देता है (हालांकि यह क्रोम, फ़ायरफ़ॉक्स और अन्य ब्राउज़रों में ठीक काम करता है)।

मैं निम्न मार्कअप उपयोग कर रहा हूँ यह पूरा करने के:

<img alt="grapefruit logo" src="/assets/better-gf-logo_red.svg" /> 

यहाँ करने के लिए पृष्ठ जहाँ एसवीजी दिखाई नहीं दे रहा एक जीवित कड़ी है। ऊपरी बाएं कोने में फल लोगो सफारी में प्रदर्शित नहीं होता है: https://grapefruit.cs.rpi.edu/।

मैं निम्न पंक्ति को सत्यापित किया है भी मेरी nginx mime.types में मौजूद है:

image/svg+xml       svg svgz; 

हालांकि, मुझे पता है कि इस मुद्दे को शायद माइम प्रकार से संबंधित नहीं है, के बाद से एसवीजी पर सफारी में प्रकट नहीं होता है मेरी विकास मशीन या तो (मैंने कई वेब सर्वरों का परीक्षण किया)। मैंने सफारी में SVG file itself प्रदर्शित करने का भी प्रयास किया है, और यह ठीक दिखता है। छवि तत्व का सही आकार और बॉक्स मॉडल है, लेकिन यह किसी भी सामग्री को प्रदर्शित नहीं कर रहा है।

Answer 1

बाहर निकलता है कि <img src="image.svg"> सफारी में काम नहीं करेगा, मैंने <object> का उपयोग करने की कोशिश की और यह काम किया। केवल के रूप में सहेजा यह पीएनजी (नहीं वेक्टर) है - jsBin demo

<object 
    type="image/svg+xml" 
    height="70" 
    width="150" 
    data="/assets/better-gf-logo_red.svg"> 
</object> 

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/object

Answer 2

अपने सभी छवि पहले एसवीजी
आप एक पाठ संपादक में खोलें और देख सकते हैं नहीं है: इस आज़मा कर देखें एसवीजी

... width="1640" height="422" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgA... 

यहां जांच http://jsbin.com/kayiwe/