How to change the position of Ticks elements in Jqplot?

Asked

Viewed 316 times

5

I need to know how to change the position of the Ticks (Graph Entities) so that they are diagonal instead of vertical, because as shown in the attached image, the names overwrite each other when they reach a certain size.

<script type="text/javascript">    
$(document).ready(function () {
    $.jqplot.config.enablePlugins = true;
    var s1 = [21, 61, 72, 10, 30, 15, 30, 51, 22, 48];
    var ticks = ['Eduardo Nobre da Silva Sousa', 'Eduardo Nobre da Silva Sousa', 'Eduardo', 'Eduardo', 'Eduardo', 'Eduardo', 'Eduardo', 'Eduardo', 'Eduardo', 'Eduardo'];
    plot1 = $.jqplot('chart1', [s1], {
        // Only animate if we're not using excanvas (not in IE 7 or IE 8)..                 
        animate: !$.jqplot.use_excanvas,
        seriesDefaults: {
            renderer: $.jqplot.BarRenderer,
            pointLabels: {
                show: true
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                ticks: ticks
            }
        },
        highlighter: {
            show: false
        }
    });
    $('#chart1').bind('jqplotDataClick',
        function (ev, seriesIndex, pointIndex, data) {
            $('#info1').html('series: ' + seriesIndex + ', point: ' + pointIndex + ', data: ' + data);
        }
    );
});
</script>

grafico

1 answer

3


I found the answer, it is very simple just add the object below and set the angle.

axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer ,
        tickOptions: {
          angle: -70,
          fontSize: '10pt'
         }
    },

inserir a descrição da imagem aqui

Browser other questions tagged

You are not signed in. Login or sign up in order to post.