यूनिकोड वर्णों के साथ एसवीजी टेक्स्ट तत्व

पहला - किसी समस्या का संक्षिप्त विवरण। मैं कुछ पाठ लेबल एसवीजी कैनवास में रखने के लिए एक जावास्क्रिप्ट फ़ंक्शन लिखता हूं। संदेश यह है:यूनिकोड वर्णों के साथ एसवीजी टेक्स्ट तत्व

function set_label(x,y,title) 
{ 
var newTitle = document.createElementNS(svgNS,"text"); 
newTitle.setAttributeNS(null,"x",x); 
newTitle.setAttributeNS(null,"y",y); 
newTitle.setAttributeNS(null,"font-size","17px"); 
newTitle.setAttributeNS(null,"font-family","WinGreek");  
var textNode = document.createTextNode(title); 
newTitle.appendChild(textNode); 
document.getElementById("viewport").appendChild(newTitle); 
}

मैं अपने प्रोजेक्ट बिंदुओं के कारण यूनानी फ़ॉन्ट का उपयोग करना होगा। तो, मैं फ़ंक्शन को कॉल करें:

set_label (10,50,'Qitos')

इस Ktitos लेबल प्रदर्शित करते हैं - कोई बात नहीं।

लेकिन - जब मैं इस तरह कॉल करने के लिए प्रयास करें:

set_label (10,50,'Qam&#218;raj')

या भी बदतर:

set_label (10,50,'&#920;&#945;&#961;&#963;&#945;&#957;&#948;&#945;&#955;&#945;')

इस प्रदर्शित करना चाहिए Θ α ρ σ α ν δ α λ α शीर्षक सभी विशेष पात्रों से गठित - एक समस्या accrue - utf-8 प्रतीक प्रकट होता है जैसे मैं इसे लिखता हूं - कोड के साथ :(

अन्य समान प्रश्नों में यहां कुछ शोध के बाद, मुझे लगता है कि अगर मैं यूटीएफ -8 कोड को परिवर्तित करता हूं ESC अनुक्रम, \ U00B0 की तरह - इस समस्या का समाधान करना चाहिए, लेकिन ... - मैं इसे समझ कैसे करना है नहीं कर सकते यह और - कैसे करना है, तो विशेष वर्ण स्ट्रिंग के बीच में है कि - दूसरे उदाहरण की तरह

स्रोत

2011-04-29 xentia

मैंने इसे यूटीएफ -8 के बजाय यूनिकोड के रूप में दोबारा जोड़ा क्योंकि इसका यूटीएफ -8 के साथ कुछ लेना देना नहीं है। यूटीएफ -8 प्रतीक जैसी कोई चीज नहीं है। यूनिकोड पूर्णांक और प्रतीकों के बीच मैपिंग को परिभाषित करता है। यूटीएफ -8 पूर्णांक और बाइट अनुक्रमों के बीच मैपिंग को परिभाषित करता है। अधिक विस्तृत स्पष्टीकरण के लिए http://www.differencebetween.net/technology/difference-between-unicode-and-utf-8/ देखें। –

Thsnk की माइक सैमुअल :) आप बिल्कुल सही हैं। – xentia

यह वास्तव में आसान है: बस अपने दस्तावेज़ में वास्तविक यूनिकोड वर्ण आप चाहते डाल दिया, UTF-8 के रूप में दस्तावेज़ सहेजें, और कहा कि दस्तावेज़ UTF-8 वर्ण सेट का उपयोग कर रहा है निर्दिष्ट करें।

पृष्ठ के शीर्षक में:

यहाँ a live example on my website दिखा है कि आप इन अक्षरों का प्रयोग कर सकते हैं।
सीधे आपके पाठ में।
जावास्क्रिप्ट तारों के अंदर।

नोट है कि मैं एक UTF-8 एन्कोडिंग के साथ इस फ़ाइल को बचाया और गए नोटिस फ़ाइल के शीर्ष है:

<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />

बंद मौका है कि मेरी साइट नीचे, यहाँ है पर सामग्री दी गई है उदाहरण के:

<!DOCTYPE HTML> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> 
    <meta http-equiv="content-type" 
     content="application/xhtml+xml; charset=utf-8"/> 
    <title>Θαρσανδαλα</title> 
    <style type="text/css" media="screen"> 
    body { background:#eee; margin:0 } 
    svg { display:block; border:1px solid #ccc; margin:2em auto; 
      width:300px; height:200px; background:#fff } 
    svg text { text-anchor:middle } 
    </style> 
</head><body> 

    <svg xmlns="http://www.w3.org/2000/svg" version="1.1" baseProfile="full" 
     viewBox="-150 -100 300 200"> 
    <text>Inline: Θαρσανδαλα</text> 
    </svg> 
    <script type="text/javascript"><![CDATA[ 
    var svg = document.getElementsByTagName('svg')[0];  
    createOn(svg,'text',{y:20,"font-size":"17px"},"Generated: Θαρσανδαλα"); 

    function createOn(root,name,attrs,text){ 
     var doc=root.ownerDocument, svg=root; 
     while (svg.tagName!='svg') svg=svg.parentNode; 
     var svgNS = svg.getAttribute('xmlns'); 
     var el = doc.createElementNS(svgNS,name); 
     for (var attr in attrs){ 
     if (attrs.hasOwnProperty(attr)){ 
      var parts = attr.split(':'); 
      if (parts[1]) el.setAttributeNS(
      svg.getAttribute('xmlns:'+parts[0]), parts[1], attrs[attr] 
     ); 
      else el.setAttributeNS(null,attr,attrs[attr]); 
     } 
     } 
     if (text) el.appendChild(document.createTextNode(text)); 
     return root.appendChild(el); 
    }   
    ]]></script> 
</body></html>

स्रोत

2011-04-29 16:22:41 Phrogz

हां, यह बहुत अच्छा विकल्प है! क्या मैं अपनी परियोजना में अपनी विधि का उपयोग कर सकता हूं? पहले ही, आपका बहुत धन्यवाद। – xentia

@xentia बेशक आप कर सकते हैं! :) – Phrogz

साथ

set_label (10,50,'Qam&#218;raj')

बदलें

set_lavel(10, 50, "Qam\u00DAraj");

"\ u00DA" कोडपॉइंट 218. के लिए चार हेक्स अंक

इसी तरह, अपने अन्य लेबल होगा

set_label (10,50,'\u0398\u03b1\u03c1\u03c3\u03b1\u03bd\u03b4\u03b1\u03bb\u03b1')

आप एक यूनानी चरित्र के लिए हेक्स जानना चाहते हैं तो है, आप कर सकते हैं http://www.squarefree.com/shell/shell.html के पास जाकर टाइप

var hex = "Α".charCodeAt(0).toString(16); 
[, "\\x0", "\\x", "\\u0", "\\u"][hex.length] + hex;

की तरह कुछ जो "Α" के लिए

का उत्पादन

\u0391

स्रोत

2011-04-29 14:17:53

मुझे इस साइट पर एक संभावित समाधान मिला: http://people.w3.org/rishida/tools/conversion/ यह कोडिंग के सभी बदलावों से और एक अद्भुत जावा स्क्रिप्ट कनवर्टर है। इसके पीछे जावा स्क्रिप्ट इंजन सिर्फ मेरी समस्या के लिए जरूरी है। सिर्फ यह देखने के लिए कि क्या मैं इसे अपने प्रोजेक्ट में उपयोग कर सकता हूं - मुझे नहीं पता, मुझे लेखक से संपर्क करना होगा। – xentia

यूनिकोड वर्णों के साथ एसवीजी टेक्स्ट तत्व

उत्तर

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