Focal Point
[CLOSED] Rotate Y Axis Titles - Horizontal Bar chart

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/8507043296

January 13, 2020, 02:36 PM
Siva1925
[CLOSED] Rotate Y Axis Titles - Horizontal Bar chart
The Y axis label in Horizontal Bar chart is printed vertically by default. I tried to rotate it using
 setTextRotation(getO1Title(),2); 

But there are only 90,270 and 45 degree rotations.

Is there a way to print the title horizontally.

WF 8205

This message has been edited. Last edited by: FP Mod Chuck,
January 13, 2020, 03:52 PM
NARSA
Hi,

Can you provide the sample with CAR file.


Thanks


WebFOCUS 7x & 8x

January 14, 2020, 07:30 AM
MartinY
Not clear what you are requesting.
The default label printing is horizontal (reading from left to right) not vertical.
A rotation of 90 or 270 degree "transform" an horizontal to vertical.

ENGINE INT CACHE SET ON
SET PAGE-NUM=NOLEAD
SET ARGRAPHENGINE=JSCHART
SET EMBEDHEADING=ON
SET GRAPHDEFAULT=OFF
-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';
-DEFAULTH &WF_TITLE='WebFOCUS Report';
GRAPH FILE car
SUM CAR.BODY.DEALER_COST
BY CAR.COMP.CAR
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET AUTOFIT ON
ON GRAPH SET GRWIDTH 1
ON GRAPH SET UNITS &WF_STYLE_UNITS
ON GRAPH SET HAXIS &WF_STYLE_WIDTH
ON GRAPH SET VAXIS &WF_STYLE_HEIGHT
ON GRAPH SET LOOKGRAPH BAR
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_SCRIPT
setPieDepth(0);
setPieTilt(0);
setDepthRadius(0);
setPlace(true);
setCurveFitEquationDisplay(false);
*END
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/Warm.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, $
TYPE=DATA, COLUMN=N1, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N2, BUCKET=y-axis, $
*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
-*-* 90 degrees counter clock from default horizontal display (left to right reading)
-*-* Become vertical reading from bottom to top
-*setTextRotation(getY1Label(),1);
-*-* 270 degrees counter clock from default horizontal display (left to right reading)
-*-* Become vertical reading from top to bottom
-*setTextRotation(getY1Label(),2);
-*-* 45 degrees counter clock from default horizontal display (left to right reading)
-*-* Become angle reading from bottom-left to to top-right
-*setTextRotation(getY1Label(),3);
*GRAPH_JS_FINAL
"pieProperties": {
    "holeSize": "0%"
},
"blaProperties": {
    "orientation": "horizontal"
},
"agnosticSettings": {
    "chartTypeFullName": "Bar_Clustered_Horizontal"
}
*END
ENDSTYLE
END
-RUN

If this doesn't answer you request, please provide a sample code as per NARSA suggested


WF versions : Prod 8.2.04M gen 33, Dev 8.2.04M gen 33, OS : Windows, DB : MSSQL, Outputs : HTML, Excel, PDF
In Focus since 2007
January 15, 2020, 10:41 AM
Siva1925
Sorry -My question is about the axis title and not axis labels.

In the FEX which you have added the title "CAR" on Y axis is horizontal. Can this be made vertical.
January 15, 2020, 10:55 PM
Hallway
I looked in the docs and couldn't see anything.

You can manipulate the chart after it renders with a little JS.

~~~ DISCLAIMER: This is a total hack ~~~
 
GRAPH FILE ibisamp/car
SUM SALES
BY CAR
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET UNITS PIXELS
ON GRAPH SET HAXIS 770.0
ON GRAPH SET VAXIS 405.0
ON GRAPH SET LOOKGRAPH BAR
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/endeflt.sty,$
TYPE=DATA, COLUMN=N1, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N2, BUCKET=y-axis, $
ENDSTYLE
END
-RUN

-HTMLFORM BEGIN NOEVAL
<script>
    window.addEventListener('load', function() {
        const yAxis = document.querySelector('text.yaxis-title')
        const regex = /\brotate\([-0-9]+\)/;
        const str = yAxis.getAttribute('transform');
        const subst = 'rotate(0)';
        const result = str.replace(regex, subst);
        const textLen = Math.ceil(document.querySelector('text.yaxis-title').textLength.baseVal.value)
        yAxis.setAttribute('transform',result);
        yAxis.setAttribute('x',textLen/2);
    });
</script>
-HTMLFORM END
 

😋

This message has been edited. Last edited by: Hallway,


Hallway

 
Prod: 8202M1
Test: 8202M4
Repository:
 
OS:
 
Outputs:
 
 
 
 
January 16, 2020, 01:44 PM
Siva1925
Thanks Hallway.
But I need to add the graph in a compound PDF report where the HTMLFORM BEGIN and END gets ignored.
January 16, 2020, 04:03 PM
Hallway
Yeah, it wasn't meant as a real solution. I was just having fun.

I would probably submit a ticket and see if they know of a way to do it.


Hallway

 
Prod: 8202M1
Test: 8202M4
Repository:
 
OS:
 
Outputs:
 
 
 
 
January 16, 2020, 05:10 PM
Hallway
I may have found what you need in the docs: Defining the Position of the Y-Axis or Y2-Axis Title
  
GRAPH FILE ibisamp/car
SUM SALES
BY CAR
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET UNITS PIXELS
ON GRAPH SET HAXIS 770.0
ON GRAPH SET VAXIS 405.0
ON GRAPH SET LOOKGRAPH BAR
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/endeflt.sty,$
TYPE=DATA, COLUMN=N1, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N2, BUCKET=y-axis, $
*GRAPH_JS
"yaxis": {
    "title": {
        "visible": true,
        "position": "orthogonal",
        "font": "bold 20px Arial",
        "color": "red"
    },
    "bodyLineStyle": {
        "width": 4,
        "color": "blue"
    }
}
*END
ENDSTYLE
END
-RUN




Hallway

 
Prod: 8202M1
Test: 8202M4
Repository:
 
OS:
 
Outputs: