2011-03-15 12 views
6

मुझे एक्स-अक्ष में टिकों के बारे में एक प्रश्न है। मैं jqPlot 0.9.7jqPlot - x-axis में कोण के साथ multiline ticks

के साथ काम करता हूं मेरी टिकियां बहुमुखी हैं, जैसे: a <br> b <br> c <br> d। मैं renderer: $.jqplot.CategoryAxisRenderer का उपयोग करता हूं और यह अच्छी तरह से काम करता है, इसलिए टिक्स मल्टीलाइन और
कार्यों में दिखाए जाते हैं।

अब मुझे उन्हें 30º घुमाए जाने की आवश्यकता है। मैंने 'कोण: -30' की कोशिश की लेकिन यह काम नहीं करता है।

इस config के साथ

:

xaxis: { 
     renderer: $.jqplot.CategoryAxisRenderer, 
     tickRenderer: $.jqplot.CanvasAxisTickRenderer , 
     ticks: ['a <br> b <br> c <br> d' , 'p <br> q <br> r <br> s'], 
     tickOptions:{ 
       angle: -30, 
       fontSize: '9px' 
     } 

} 

टिक एक एकल, घुमाया, लंबी लाइन में दिखाए जाते हैं। न तो <br> और न ही \n की व्याख्या के रूप में व्याख्या की जा रही है। यह मुझे मिला सबसे अच्छा तरीका है।

क्या इसके लिए कोई समाधान है? मैं घुमावदार पाठ टिक कैसे लिख सकता हूं?

कोई भी सुझाव मेरे लिए बहुत उपयोगी होगा। अग्रिम धन्यवाद। सबसे अच्छा

उत्तर

16

काम करने के लिए सही वाक्यविन्यास के लिए आपको निम्न jripPlots स्क्रिप्ट के साथ निम्न स्क्रिप्ट शामिल करने की आवश्यकता है।

  • jqplot.canvasTextRenderer.min.js
  • jqplot.dateAxisRenderer.min.js
  • jqplot.canvasAxisTickRenderer.min.js

(ऊपर फ़ाइलों jqPlot पैकेज के साथ आता है)।

फिर

axesDefaults: { 
    tickRenderer: $.jqplot.CanvasAxisTickRenderer , 
}, 

साजिश विकल्पों की सूची के लिए निम्न जोड़ने फिर अपने

tickOptions: { 
     angle: -30, 
    } 

प्रभावी हो जाएगा।

उदा। jqPlot से

.... 
    series: [{renderer: $.jqplot.BarRenderer}], 
    axesDefaults: { 
     tickRenderer: $.jqplot.CanvasAxisTickRenderer , 
     tickOptions: { 
      angle: -90, 
      fontSize: '10pt' 
     } 
    }, 
    axes: { 
     xaxis: { 
      renderer: $.jqplot.CategoryAxisRenderer, 
      ticks: ticks 
     }, 
     yaxis: {  
      tickOptions: { 
       angle: 0, 
       fontSize: '10pt' 
      } 
     } 
    }, 
.... 

उदाहरण यहां पाया जा सकता: http://www.jqplot.com/tests/rotated-tick-labels.php

+0

मैं अपने स्क्रिप्ट में इस है, लेकिन यह कुछ भी नहीं कर रहा है :(और हाँ मेरे पास स्क्रिप्ट हैं – AntonioCS

3

जोड़ने के लिए मत भूलना:

<script type="text/javascript" src="../src/plugins/jqplot.canvasTextRenderer.min.js"></script> 
<script type="text/javascript" src="../src/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>