Terry
Terry

Reputation: 1457

jqplot y-axis label isn't vertical

I've spent the better part of two days trying to make the y-axis label vertical without success. So, for the first time I've set up a jsfiddle (hope I've done that right) that shows the same problem as my code, which other than the y-axis labeling problem works as it should.

var fLatImb = [
[-10, 400000],
[-10, 797000],
[-2.9, 878000],
[2.9, 878000],
[10, 797000],
[10, 400000]
];

$.jqplot.config.enablePlugins = true;
dpLatImbOpt = {
    seriesDefaults: {
        shadow: false
    },
    axes: {
        xaxis: {
            min: -15,
            max: 15,
            numberTicks: 7,
            label: '← left · 1000000 in-lbs · right →'
        },
        yaxis: {
            min: 400000,
            max: 950000,
            numberTicks: 12,
            label: 'lbs gross weight',
            labelRenderer: $.jqplot.CanvasAxisLabelRenderer
        }
    },
    grid: {
        background: 'black',
        gridLineColor: '#666666',
        shadow: false
    },
    highlighter: {
        fadeTooltip: false,
        show: true,
        showToolTip: true,
        useAxesFormatters: true,
        formatString: '%.1f,%.0f'
    },
    series: [{
        color: 'red'
    }]
};

$.jqplot('dpLatImb', [fLatImb], dpLatImbOpt); 

I had thought that supplying the labelRenderer for the y-axis would cause the default to be vertical alignment of that label, but such is not the case and I can't see why.

The jsfiddle is at http://jsfiddle.net/tliitts/RkkeT/14/

The obscure y-axis label reads 'lbs gross weight'.

Suggestions relating to other than the immediate problem are welcome as I am a relative newbiew.

Upvotes: 1

Views: 2022

Answers (1)

nick_w
nick_w

Reputation: 14938

Looking at your current scripts:

<script src='http://terryliittschwager.com/WB/jslib/jquery.jqplot.min.js'></script>
<script src='http://terryliittschwager.com/WB/jslib/jqplot.canvasTextRenderer.min.js></script>
<script src='http://terryliittschwager.com/WB/jslib/jqplot.canvasAxisLabelRenderer.min.js></script>
<script src='http://terryliittschwager.com/WB/jslib/jqplot.highlighter.min.js'></script>
<div id="dpLatImb" style="margin-top:20px; margin-left:20px; width:400px; height:400px;"></div>

There is a missing ' character in these two:

<script src='http://terryliittschwager.com/WB/jslib/jqplot.canvasTextRenderer.min.js></script>
<script src='http://terryliittschwager.com/WB/jslib/jqplot.canvasAxisLabelRenderer.min.js></script>

If I add a' just after jqplot.canvasTextRenderer.min.js and jqplot.canvasAxisLabelRenderer.min.js, then that fiddle will display the y-axis label vertically.

Upvotes: 1

Related Questions