Focal Point
[CLOSED] Graphs on HTML Report

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

July 13, 2015, 03:26 PM
Dylan Bustillo
[CLOSED] Graphs on HTML Report
I am trying to create an HTMLFORM report that contains both a table and two graphs (we formatted them using JSCHART format so hopefully there is a way the formatting we did can stay as part of this change).

I regularly use the code below to create this exact style of report containing multiple tables but unfortunately I don’t know how to do the below including a graph. The syntax we use to save a table is ON TABLE SAVE AS 'MYREPORT1' FORMAT HTMTABLE.

-HTMLFORM BEGIN




< !-- WEBFOCUS TABLE MYREPORT1 -->
< !-- WEBFOCUS TABLE MYREPORT2 -->
< !-- WEBFOCUS TABLE MYREPORT3 -->
< !-- WEBFOCUS TABLE MYREPORT4 -->
< !-- WEBFOCUS TABLE MYREPORT5 -->
< !-- WEBFOCUS TABLE MYREPORT6 -->



WebFOCUS 8
Windows, All Outputs
July 14, 2015, 08:36 AM
<nick z>
Yes,
You can just do ON GRAPH HOLD AS 'Chart_name' FORMAT JSCHART.

Here is an example of adding 2 JSCHARTS in HTML page:

GRAPH FILE CAR
SUM SALES BY COUNTRY
HEADING
"Sales by country"

ON GRAPH HOLD FORMAT JSCHART AS REPORT1
END
GRAPH FILE GGSALES
SUM DOLLARS UNITS BY CATEGORY
HEADING
"Production Order Summary"

ON GRAPH HOLD FORMAT JSCHART AS REPORT2
END
-HTMLFORM BEGIN
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
<TABLE BORDER='1'>
<TR>
<TD valign=top>
!IBI.FIL.REPORT1;
</TD>
<TD valign=top>
!IBI.FIL.REPORT2;
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
-HTMLFORM END


Note:
Please make sure you either don't have:
ON GRAPH SET AUTOFIT ON
in your Chart code or set AUTOFIT to OFF.


Thanks.
Nick.
July 14, 2015, 09:32 AM
Francis Mariani
Also,
quote:
< !-- WEBFOCUS TABLE MYREPORT1 -->

is a very old method of including files into an HTML page. I don't think it's documented any more.

Use
!IBI.FIL.MYREPORT1;



Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
July 14, 2015, 10:28 AM
Dylan Bustillo
The code displays two graphs, however the first graph displays as a bar graph regardless of which graph I put first.

Additionally, the months on the X-axis are displaying out of order even though the graph itself appears to include the correct data points.

Because I want to display the month abbreviation, but sort by month I am using the below BY fields:

BY GRAPH_FR_22.GRAPH_FR.MNT_NUM NOPRINT
BY GRAPH_FR_22.GRAPH_FR.MONTH_ABV AS 'Month'
BY GRAPH_FR_22.GRAPH_FR.DAY_NUM_1 NOPRINT



Thanks!


WebFOCUS 8
Windows, All Outputs
July 14, 2015, 10:43 AM
Francis Mariani
A slight variation of nick's very good example to show two different graph types works. Check the code of each of your graphs carefully.

GRAPH FILE CAR
SUM SALES
BY COUNTRY
HEADING
"Sales by country"
ON GRAPH HOLD AS REPORT1 FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET GRMERGE ADVANCED
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 0
ON GRAPH SET GRXAXIS 1
ON GRAPH SET LOOKGRAPH PIEMULTI
ON GRAPH SET STYLE *
*GRAPH_SCRIPT
setPieDepth(0);
setPieTilt(0);
setDepthRadius(0);
setCurveFitEquationDisplay(false);
setPlace(true);
setPieFeelerTextDisplay(1);
*END
*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
*END
ENDSTYLE
END
-RUN

GRAPH FILE GGSALES
SUM DOLLARS UNITS BY CATEGORY
HEADING
"Production Order Summary"

ON GRAPH HOLD FORMAT JSCHART AS REPORT2
END
-RUN

-HTMLFORM BEGIN
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
<TABLE BORDER='1'>
<TR>
<TD valign=top>
!IBI.FIL.REPORT1;
</TD>
<TD valign=top>
!IBI.FIL.REPORT2;
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
-HTMLFORM END



Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
July 14, 2015, 04:02 PM
Dylan Bustillo
Sorry if there was any confusion. The graph formats are the same (VLINE), but when I run it the first graph displays as a bar graph.

ON GRAPH HOLD AS 'FR_AFT_GPH' FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET UNITS &WF_STYLE_UNITS
ON GRAPH SET HAXIS &WF_STYLE_WIDTH
ON GRAPH SET VAXIS &WF_STYLE_HEIGHT
ON GRAPH SET GRMERGE ADVANCED
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 0
ON GRAPH SET GRXAXIS 3
ON GRAPH SET LOOKGRAPH VLINE
ON GRAPH SET AUTOFIT OFF
ON GRAPH SET STYLE *
*GRAPH_SCRIPT


WebFOCUS 8
Windows, All Outputs
July 14, 2015, 05:20 PM
David Briars
http://forums.informationbuild...027046176#9027046176

This thread seems to point to a similar symptom. Could you try adding DOCTYPE to your HTML?




Pilot: WebFOCUS 8.2.06 Test: WebFOCUS 8.1.05M Prod: WebFOCUS 8.1.05M Server: Windows Server 2016/Tomcat Standalone Workstation: Windows 10/IE11+Edge Database: Oracle 12c, Netezza, & MS SQL Server 2019 Output: AHTML/XLSX/HTML/PDF/JSCHART Tools: WFDS, Repository Content, BI Portal Designer & ReportCaster
July 17, 2015, 10:00 AM
Dylan Bustillo
I reviewed the thread an added < !DOCTYPE html> , but the first graph still displays as a bar chart when it is formatted as a line graph. I feel that this might be a version specific issue.

Below is the code I am using for my HTML Form:

-HTMLFORM BEGIN
< !DOCTYPE html>



< !-- WEBFOCUS TABLE FR_TABLE -->
< !-- WEBFOCUS TABLE FR_BEF_GPH -->
< !-- WEBFOCUS TABLE FR_AFT_GPH -->



WebFOCUS 8
Windows, All Outputs