2010-12-09 9 views
8

मैं documentation for Raphael में वर्णित प्रिंट कमांड का उपयोग करने की कोशिश कर रहा हूं, ठीक है, एक अच्छे फ़ॉन्ट के साथ टेक्स्ट प्रिंट करें। [मुझे लगता है कि यह "टेक्स्ट" फ़ंक्शन का उपयोग करके अच्छी तरह से किया जा सकता है, और मैं प्रिंट फ़ंक्शन के साथ Cufon द्वारा उत्पन्न फ़ॉन्ट्स का उपयोग करके वेब पर उदाहरण देखता हूं (जैसा कि इन examples for 'text' and 'print' में), लेकिन मैं जो कर रहा हूं वह करीब है यह दस्तावेज में उदाहरण के लिए कर सकते हैं और मेरे लिए काम नहीं करता है, और मुझे पता है क्यों चाहते हैं]क्या मैं कफॉन के बिना राफेल में प्रिंट का उपयोग कर सकता हूं?

यहाँ मेरी कोड है:।

<html> 
    <head> 
     <title>Raphael Print Test</title> 
     <script src="raphael.js" type="text/javascript" charset="utf-8"></script> 
     <script type="text/javascript" charset="utf-8"> 
     window.onload = function() { 
      var paper = new Raphael('holder', 640, 480); 
      paper.ellipse(320, 240, 320, 240).attr({stroke: "grey"}); 
      paper.print(100, 100, "Test string", paper.getFont("Times", 800), 30); 
      paper.text(50, 50, "Raphaël\nkicks\nbutt!"); 
     } 
     </script> 
     <style type="text/css"> 
      #holder { width: 640px; height: 480px; border: 2px solid #aaa; } 
     </style> 
    </head> 
    <body> 
     <div id="holder"></div> 
    </body> 
</html> 

महत्वपूर्ण लाइन है:

paper.print(100, 100, "Test string", paper.getFont("Times", 800), 30); 

as documented here

जब मैं यह कोशिश (क्रोम और ओपेरा ओएस एक्स पर में, अब तक) मैं:

  • एक सफेद क्षेत्र एक ग्रे अंडाकार
  • पर आकर्षित करने के लिए
  • पाठ "Raphaël \ nkicks \ nbutt! "

लेकिन मुझे नहीं लगता: "टेस्ट स्ट्रिंग" कहीं भी।

मैं राफेल बनाम 1.4.7 का उपयोग कर रहा हूं (जो मैंने सोचा था कि कल के रूप में चालू था, लेकिन मुझे लगता है कि संस्करण 1.5.2 अब बाहर है)।

उत्तर

20

आप स्पष्ट रूप से फ़ॉन्ट (पंजीकरण रजिस्टर() को कॉल करके प्रिंट() का उपयोग नहीं कर सकते हैं, और Cufon आमतौर पर ऐसा किया जाता है। Cufon आपको एक कस्टम फ़ॉन्ट का उपयोग करने की अनुमति देता है। यदि आप मानक फोंट का उपयोग करना चाहते हैं, तो आप टेक्स्ट() का उपयोग कर सकते हैं और attr() फ़ंक्शन का उपयोग करके फ़ॉन्ट गुण सेट कर सकते हैं।


यह मुझे कुछ समय लिया यह पता लगाने की क्यों उदाहरण 'प्रिंट' समारोह जब मेरे अपने पेज में एम्बेड काम नहीं किया। सरल जवाब यह है कि आप पहले 'रजिस्टरफॉन्ट' फ़ंक्शन को कॉल किए बिना 'प्रिंट' फ़ंक्शन का उपयोग नहीं कर सकते हैं।

यदि आप राफेल के संदर्भ पृष्ठ के स्रोत पर ध्यान से देखते हैं, तो आप 'रजिस्टरफॉन्ट' कॉल का उपयोग नहीं करेंगे क्योंकि वे 'museo.js' पृष्ठ में एम्बेड किए गए हैं। वहां आप 'रजिस्टरफॉन्ट' कॉल देखेंगे। आप यह भी ध्यान दें कि वे वास्तव में 'म्यूज़ो' फ़ॉन्ट के साथ प्रिंट फ़ंक्शन का उपयोग अपने प्रिंट उदाहरण कोड में करते हैं, न कि 'टाइम्स' फ़ॉन्ट।

इस बिंदु पर मुझे एहसास हुआ कि attr() फ़ंक्शन के साथ संयुक्त पाठ() फ़ंक्शन मेरी आवश्यकताओं के लिए पर्याप्त होगा, इसलिए मैंने Cufon (क्षमा करें) में आगे नहीं देखा।

यहां कोड का एक सरल स्निपेट है जो दर्शाता है कि पाठ() और attr() फ़ंक्शंस का उपयोग मानक फोंट में से किसी एक में प्रदर्शित करने के लिए किया जाता है।

paper.text(50, 50, "Raphaël\nkicks\nbutt!").attr(
    {"font-family":"serif", 
    "font-style":"italic", 
    "font-size":"30"}); 

आप बस पाठ() फ़ंक्शन के परिणाम पर attr() कहते हैं, और गुण आप चाहते हैं संकेत मिलता है।

आशा है कि यदि आपको अपने कस्टम फ़ॉन्ट की आवश्यकता नहीं है तो समस्या और संभावित समाधान को समझने में आपकी सहायता करें।

+1

मेरी समस्या हल हो गई। यह Google वेब फोंट के साथ भी काम करता है। – bennedich

+0

क्या आप आर.प्रिंट के साथ Google वेब फोंट का उपयोग कर सकते हैं? क्या मुझे पता चलेगा कैसे? मुझे यहां एक ही समस्या का सामना करना पड़ रहा है –

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

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