2012-10-02 12 views
6

लिंक: http://jsfiddle.net/xkpeD/सफारी 6 svg टैग उपयोग जारी करता

या सिर्फ

<svg width="300px" height="300px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <circle cx="50" cy="50" r="20" fill="pink" fill-opacity="0.5"/> 
    <use xlink:href="#:example" x="20" y="20"/> 
    <defs> 
    <circle id=":example" cx="50" cy="50" r="20" fill="pink" fill-opacity="0.5"/> 
    </defs> 
</svg>​ 

यह सभी ब्राउज़रों (IE9, क्रोम, फायरफॉक्स, सफारी 5.1) में ठीक प्रदर्शित करता है, लेकिन नई सफारी 6 केवल 1 घेरे में प्रस्तुत किया जाता है। ऐसा लगता है कि सभी < उपयोग> टैग सफारी 6 में प्रस्तुत नहीं किए जाते हैं।

कोई मदद कृपया?

+0

क्या आपने तत्व से पहले अनुभाग डालने का प्रयास किया है? –

+0

हां। यह मदद नहीं की। –

+3

अंतिम टिप्पणी यहां देखें: http://stackoverflow.com/questions/11514248/svg-use-elements-in-chrome-not-displayed?rq=1। अगर उन्होंने अभी तक यह तय नहीं किया है, तो आप त्वरित प्रतिक्रिया के रूप में को प्रतिस्थापित करने का प्रयास कर सकते हैं। – skozin

उत्तर

5

sam.kozin का उत्तर मेरे लिए काम किया। बस इतना है कि इस जवाब में वास्तव में दृश्यता है।

< उपयोग बदलें .../> < उपयोग के साथ ... > </का उपयोग >

तो:

<svg width="300px" height="300px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <circle cx="50" cy="50" r="20" fill="pink" fill-opacity="0.5"/> 
    <use xlink:href="#:example" x="20" y="20"></use> 
    <defs> 
    <circle id=":example" cx="50" cy="50" r="20" fill="pink" fill-opacity="0.5"/> 
    </defs> 
</svg>​ 
0

जांचें कि क्या आप सही http सामग्री-प्रकार शीर्षलेख का उपयोग कर रहे हैं और अपने दस्तावेज़ को वैध XML के रूप में सेवा दे रहे हैं। इस समान question में अधिक जानकारी।

7

मैं एक ही मुद्दा है, ओ पी थी। मैं 2 कार्य करके इसे हल कदम

  1. अलग किए <use> और <defs> 2 अलग में <svg> की (यकीन नहीं करता है, तो यह चरण आवश्यक है, यह भी अन्य कारणों के लिए यह करना ही था)। साइड नोट, यदि <svg> में केवल <defs> है, तो आप लेआउट में स्थान नहीं लेने के लिए style="display: none;" का उपयोग कर सकते हैं।

  2. ले जाया गया <svg> मेरी HTML में <use> युक्त <defs><svg> ऊपर हैं। यह कदम महत्वपूर्ण है।

उम्मीद है कि इससे मदद मिलती है। सफारी संस्करण 7.1.2 के लिए आवश्यक और काम करने के लिए, 12/19/14

+3

बिग अपवॉट में एक मुद्दा है !! धन्यवाद। –

1

मैं <use href=""> का उपयोग कर रहा था जो फ़ायरफ़ॉक्स/क्रोम में बिना किसी समस्या के प्रतिपादन कर रहा था, लेकिन सफारी में नहीं। तो मुझे <use xlink:href=""> में बदलना पड़ा और यह सफारी में मेरे प्रतिपादन मुद्दों को ठीक कर दिया।

संबंधित मुद्दे