2013-01-03 13 views
8

मैं हाल ही में इंटरनेट पर ब्राउज़ किए है कि वहाँ एक textArea local to SVG (मैं पाठ रैपिंग उद्देश्य के लिए इस आवश्यकता हो सकती है)एसवीजी 1.2 छोटे टेक्स्ट एरिया को कैसे कार्यान्वित करें?

मैं उदाहरण का इस्तेमाल किया और एचटीएमएल 5 तत्व के अंदर क्रोम पर यह परीक्षण किया है, लेकिन वह दिखाई नहीं देगा टेक्स्ट एरिया तत्व, कोई भी जानता है कि एसवीजी टेक्स्ट एरिया को सही तरीके से कैसे कार्यान्वित किया जाए? या यह संभव है कि एसवीजी 1.2 छोटा अभी तक समर्थित नहीं है? (मैंने केवल सामान्य एसवीजी 1.1 के साथ काम किया)

+0

<विदेशी ऑब्जेक्ट> और एक HTML textarea के अंदर क्या है? – philipp

+0

मैंने पहले से ही एक अंतिम उपाय के रूप में सहेजा है, लेकिन यदि मैं svg –

+0

के अंदर विदेशी ऑब्जेक्ट के बजाय svg से तत्व का उपयोग करता हूं तो यह अधिक कुशल होगा: http://stackoverflow.com/questions/4991171/auto-line -wrapping-in-svg-text –

उत्तर

10

जांचें कि UA http://www.w3.org/Graphics/SVG/feature/1.2/#TextFlow सुविधा स्ट्रिंग का समर्थन करता है और यदि यह करता है तो एक एसवीजी टेक्स्ट एरिया प्रदर्शित करता है, अन्यथा विदेशी ऑब्जेक्ट के अंदर एक HTML textarea प्रदर्शित करें।

<switch> 
    <g requiredFeatures="http://www.w3.org/Graphics/SVG/feature/1.2/#TextFlow"> 
     <textArea width="200" height="300">whatever</textArea> 
    </g> 
    <foreignObject width="200" height="300"> 
     <textArea xmlns="http://www.w3.org/1999/xhtml" style="width: 200px;height: 300px">otherwise</textArea> 
    </foreignObject> 
</switch> 
+0

मैंने इसे क्रोम और आईई पर परीक्षण किया और कोई भी टेक्स्टफ्लो फीचर स्ट्रिंग का समर्थन नहीं करता है, क्या आपको पता है कि कोई ब्राउजर इसे फीचर करता है या नहीं? –

+1

इस समय ओपेक के समय ओपेरा। –

+2

आवश्यक फीचर स्ट्रिंग सही है, लेकिन http://www.w3.org/TR/SVGTiny12/feature.html#specific एक बेहतर संदर्भ है। –

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