Chart Y Axis is not vertical

Post Reply
Netinium
Posts: 9
Joined: 06 Jul 2017, 16:09

06 Dec 2017, 17:24

I use the default skinZoom style:

Code: Select all

        function skinZoom() {
            this.cfg.shadow = false;
            this.cfg.title = '';
            this.cfg.seriesColors = ['#00acac', '#2f8ee5'];
            this.cfg.grid = {
                background: '#ffffff',
                borderColor: '#ffffff',
                gridLineColor: '#F5F5F5',
                shadow: false
            };
            this.cfg.axesDefaults = {
                rendererOptions: {
                    textColor: '#666F77'
                }
            };
            this.cfg.seriesDefaults = {
                shadow: false,
                lineWidth: 1,
                markerOptions: {
                    shadow: false,
                    size: 7,
                    style: 'circle'
                }
            }
        }
When I remove the part:

Code: Select all

            this.cfg.axesDefaults = {
                rendererOptions: {
                    textColor: '#666F77'
                }
            };
The Y-axis is rendered vertical but the X-axis is no longer rendered correctly.
I would like to have the text vertical and use axesDefaults to set the textColor at the same time, how can I do this?

If this is not possible and the Y axis labels are always vertical. How can I change the padding for the Y axis labels to be a fixed size. I want to show three charts below each other, and have the same alignment.

Netinium
Posts: 9
Joined: 06 Jul 2017, 16:09

19 Dec 2017, 11:04

The solution is to instruct jplot to use a Canvas renderer for the label, like this:

Code: Select all

        function skinZoom() {
            this.cfg.shadow = false;
            //this.cfg.title = '';
            this.cfg.seriesColors = ['#00acac', '#2f8ee5', '#FF4848', '#800080', '#1FCB4A', '#FF62B0', '#9A03FE', '#62D0FF', '#01FCEF', '#DFDF00'];
            this.cfg.grid = {
                background: '#ffffff',
                borderColor: '#ffffff',
                gridLineColor: '#F5F5F5',
                shadow: false
            };
            this.cfg.axesDefaults = {
                labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                rendererOptions: {
                    textColor: '#666F77'
                }
            };
            this.cfg.seriesDefaults = {
                shadow: true,
                lineWidth: 2,
                markerOptions: {
                    shadow: false,
                    size: 7,
                    style: 'circle'
                }
            }
        }

User avatar
aragorn
Posts: 3164
Joined: 29 Jun 2013, 12:38

27 Dec 2017, 16:15

Thanks a lot for the update!

Post Reply

Return to “Poseidon - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest