Focal Point
[SOLVED]Line and Bar in JS chart

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

November 03, 2015, 02:12 AM
Srinivasan_Munuswamy
[SOLVED]Line and Bar in JS chart
Hi All,
I am trying to draw combined line and bar graph. It is working fine in normal graph where the series 2 and 3 are not getting stacked, however when changed to JS chart, it is getting stacked. Any help to solve this?

Is there equivalent style script in JS for this "setForceSeriesAbsolute"


GRAPH FILE CAR
SUM
SALES AS 'SALE1'
COMPUTE SALE1/D20=SALES-100; AS 'SALE2'
COMPUTE SALE1_PERC/D20.3= ((SALES-105)/SALES)*100; AS 'SALE1 PERC'
COMPUTE SALE2_PERC/D20.3= ((SALE1-500)/SALE1)*100; AS 'SALE2 PERC'
BY COUNTRY AS ''
ON TABLE PCHOLD FORMAT JSCHART
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET BARNUMB OFF
ON GRAPH SET 3D OFF
ON GRAPH SET VZERO ON
ON GRAPH SET GRID ON
ON GRAPH SET HAXIS 700
ON GRAPH SET VAXIS 260
ON GRAPH SET UNITS PIXELS
ON GRAPH SET LOOKGRAPH VLINSTK2
ON GRAPH SET GRMERGE ON
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 0
ON GRAPH SET GRXAXIS 1
ON GRAPH SET STYLE *
*GRAPH_SCRIPT
setTemplateFile("");
setReportParsingErrors(false);
setSelectionEnableMove(false);
setForceSeriesAbsolute(getSeries(0),false);
setForceSeriesAbsolute(getSeries(1),false);
setForceSeriesAbsolute(getSeries(2),true);
setForceSeriesAbsolute(getSeries(3),true);
setSeriesType(0,1);
setSeriesType(1,1);
setAxisAssignment(0,0);
setAxisAssignment(1,0);
setAxisAssignment(2,1);
setAxisAssignment(3,1);
*END
ENDSTYLE
END
-EXIT
  

This message has been edited. Last edited by: <Emily McAllister>,


WF 8.0.0.9 Database : oracle

CURRENT:
WebFOCUS 8.0.0.9 /oracle 11 i

November 03, 2015, 04:02 AM
Wep5622
I got this working using the JS syntax as documented here: http://infocenter.informationb...Fsource%2Fopener.htm

More to the point, you need to specify a comboChart and a riserShape, as the following snippets show:
*GRAPH_JS
chartType: 'bar',
series: [
	{
		series: 'all'
	,	yAxisAssignment: 1
	},
	{
		series: 0
	,	yAxisAssignment: 2
	,	riserShape: 'line'
	}
],
yaxis: {
	mode: 'numeric', min: undefined, max: 100
},
y2axis: {
	visible: true
,	mode: 'numeric'
,	min: undefined, max: undefined
,	majorGrid: { lockToY1: true }
},
blaProperties: {
	orientation: 'vertical'
,	comboCharts: {
		barSeriesLayout: 'stacked'
	,	lineSeriesLayout: 'absolute'
	,	areaSeriesLayout: undefined
	}
}
*END


The important bits for you are the chartType and the blaProperties (silly sounding property name, but it's actually an abbreviation of something useful IIRC), and the riserShape property in series 0.

This is for a 2-axis stacked (which is now default) bar chart, hence the axis assignment in the series. Moreover, our bar chart shows stacked percentages, hence the max of 100(%).


WebFOCUS 8.1.03, Windows 7-64/2008-64, IBM DB2/400, Oracle 11g & RDB, MS SQL-Server 2005, SAP, PostgreSQL 11, Output: HTML, PDF, Excel 2010
: Member of User Group Benelux :
November 03, 2015, 04:22 AM
Srinivasan_Munuswamy
Hi Sir,

Thank you for your help. It worked. I am really not aware of this blaproperties. Your documentation link is really helpful.

Thanks again.

Also, I read the note:

When a combination chart is defined with these properties and the series#:riserShape property, area risers are drawn first in the back, then bars, then lines in the front.

Because of this, mouseover tooltip is not seen for bars. Any suggestions.

Currently I get tooltip for lines alone.

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


WF 8.0.0.9 Database : oracle

CURRENT:
WebFOCUS 8.0.0.9 /oracle 11 i

November 03, 2015, 06:58 AM
Tom Flynn
Do not understand how you were given a link and don't do anything with it. Try figuring it out for yourself instead...




Tom Flynn
WebFOCUS 8.1.05 - PROD/QA
DB2 - AS400 - Mainframe