Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jqplot vertical axis label

A really simple question but I could not figure it out... I tried to use jqplot to generate a line plot with vertical y axis label. Based on the example from jqplot web site, all I need is to use this plugin jqplot.canvasAxisLabelRenderer.min.js. I tried it locally, but it did not work. Can anyone give me a hint on this? Here is a demo of my problem.

Below is my code:

$(document).ready(function(){
        $.jqplot.config.enablePlugins = true;
        var s1 = $.parseJSON($('#x_indi_val').text());    
        $.jqplot('chart1', [s1], {                
            seriesDefaults: { 
               showMarker:false,
               pointLabels: { show:false } ,
            },                
            series:[
               {label:'Individuals'}
            ],
            axes: {
                xaxis: {
                   label :'Time units',
                   pad: 0,
                },
                yaxis: {
                    label: 'Number of individuals',
                    //jqplot example indicated that use the following js file can give you a vertical label, I tried locally, but it did not work
                    //renderer: $.jqplot.canvasAxisLabelRenderer
                }
            },
            legend: {
                show: true,
                location: 'ne',
                placement: 'inside',
                fontSize: '11px'
            } 
        });   
    })​;
like image 879
TTT Avatar asked Jul 03 '12 05:07

TTT


People also ask

What is the label for the vertical axis?

In a chart you create, axis labels are shown below the horizontal (category, or "X") axis, next to the vertical (value, or "Y") axis, and next to the depth axis (in a 3-D chart).

How do you label the vertical axis values in Excel?

Click the chart, and then click the Chart Layout tab. Under Labels, click Axis Titles, point to the axis that you want to add titles to, and then click the option that you want. Select the text in the Axis Title box, and then type an axis title.

How do you label horizontal and vertical axis?

Label your axes as you would a typical graph, with x on the horizontal axis and y on the vertical axis.


1 Answers

You had a few minor yet important issues in your code, as observed in the provided demo sample:

  1. You forgot to import the two scripts required by the label renderer:

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

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

  2. You were setting the renderer of the axis rather than the label renderer of the axis:

    labelRenderer: $.jqplot.CanvasAxisLabelRenderer

Please see the code with the corrected sample.

like image 94
Boro Avatar answered Sep 23 '22 21:09

Boro