勾选选项旋转到角度30

时间:2014-03-03 11:37:03

标签: javascript jquery plugins

我正在使用jqplot插件为我的网站获取自定义条形图。条形图[ticks]中的标签应在x轴上以-30deg的角度旋转,并带有一些自定义名称。有些人可以指导我如何做到这一点。

以下是我使用的Jqplot代码

      $(document).ready(function(){
      var s1 = [2, 6, 7, 10];
     var s2 = [7, 5, 3, 2];
     var s3 = [14, 9, 3, 8];
     plot3 = $.jqplot('chart3', [s1, s2, s3], {
        stackSeries: true,
        captureRightClick: true,
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {
                highlightMouseDown: true   
            },
            pointLabels: {show: true}
        },
        legend: {
            show: true,
            location: 'e',
            placement: 'outside'
        }      
    });

         $('#chart3').bind('jqplotDataRightClick', 
        function (ev, seriesIndex, pointIndex, data) {
            $('#info3').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
        }
    ); 
        });

2 个答案:

答案 0 :(得分:0)

看看这个

jQplot具有内置功能

http://www.jqplot.com/tests/rotated-tick-labels.php

答案 1 :(得分:0)

首先,包括这个插件:

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

然后将其添加到您的选项中。

xaxis: {

        tickRenderer: $.jqplot.CanvasAxisTickRenderer ,
        tickOptions: {
            angle: -30,
        }
       },