Here is code for a stacked bar chart using example data loaded into temp hold files. I'm running on 8.201M and creating a graph using format JSCHART. The chart creates a minichart at the bottom for scrolling purposes.
I have the following questions ...
1) The minichart hi-lights 18 months of data(which I set) and it defaults to the left(lowest months). I would like it to default to the right(highest months) ... Does anyone know how to control that?
2) Is there a way to get the ToolTip for the Total series to always display at the same location (like the upper left portion of the frame)?
3) My users would prefer an area graph, but I don't like the way the tooltips react. I get 'nul' showing up several times. If anyone knows how to get this working as an area map ... I'm interested.
If there's a better way to accomplish this ... I'm listening.
Thanks in advance for any help.
Here's the code ...
FILEDEF DATA DISK tmp_data.txt
-RUN
-WRITE DATA 20140106|0000000000000000272087|0000000000000000066031
-WRITE DATA 20140205|0000000000000000283388|0000000000000000064593
-WRITE DATA 20140301|0000000000000000200000|0000000000000000078708
-WRITE DATA 20140404|0000000000000000293341|0000000000000000078708
-WRITE DATA 20140505|0000000000000000289619|0000000000000000068452
-WRITE DATA 20140601|0000000000000000220000|0000000000000000068708
-WRITE DATA 20140701|0000000000000000230000|0000000000000000052000
-WRITE DATA 20140801|0000000000000000240000|0000000000000000042500
-WRITE DATA 20140901|0000000000000000260000|0000000000000000062250
-WRITE DATA 20141001|0000000000000000280000|0000000000000000072100
-WRITE DATA 20141101|0000000000000000300000|0000000000000000082000
-WRITE DATA 20141204|0000000000000000354687|0000000000000000091517
-WRITE DATA 20150101|0000000000000000330000|0000000000000000088272
-WRITE DATA 20150201|0000000000000000320000|0000000000000000078272
-WRITE DATA 20150303|0000000000000000352909|0000000000000000068272
-WRITE DATA 20150406|0000000000000000347566|0000000000000000057465
-WRITE DATA 20150501|0000000000000000350000|0000000000000000048272
-WRITE DATA 20150601|0000000000000000360000|0000000000000000038272
-WRITE DATA 20150701|0000000000000000370000|0000000000000000048100
-WRITE DATA 20150801|0000000000000000380000|0000000000000000058200
-WRITE DATA 20150901|0000000000000000390000|0000000000000000068300
-WRITE DATA 20151001|0000000000000000380000|0000000000000000068400
-WRITE DATA 20151101|0000000000000000370000|0000000000000000078500
-WRITE DATA 20151201|0000000000000000360000|0000000000000000078600
-WRITE DATA 20160105|0000000000000000347566|0000000000000000087465
-WRITE DATA 20160201|0000000000000000350000|0000000000000000088100
-WRITE DATA 20160301|0000000000000000355000|0000000000000000098200
-WRITE DATA 20160401|0000000000000000360000|0000000000000000098300
-WRITE DATA 20160501|0000000000000000365000|0000000000000000088400
-WRITE DATA 20160601|0000000000000000370000|0000000000000000088500
-WRITE DATA 20160701|0000000000000000375000|0000000000000000078600
-WRITE DATA 20160801|0000000000000000380000|0000000000000000068700
-WRITE DATA 20160901|0000000000000000385000|0000000000000000058800
-WRITE DATA 20161001|0000000000000000375000|0000000000000000068900
-WRITE DATA 20161101|0000000000000000365000|0000000000000000078800
-WRITE DATA 20161201|0000000000000000390000|0000000000000000088700
-WRITE DATA 20170106|0000000000000000402909|0000000000000000098272
-WRITE DATA 20170201|0000000000000000412909|0000000000000000088272
-WRITE DATA 20170301|0000000000000000322909|0000000000000000068272
-WRITE DATA 20170401|0000000000000000332909|0000000000000000078272
-WRITE DATA 20170501|0000000000000000342909|0000000000000000058272
-WRITE DATA 20170601|0000000000000000352909|0000000000000000048272
-WRITE DATA 20170701|0000000000000000362909|0000000000000000058272
-WRITE DATA 20170814|0000000000000000371998|0000000000000000068161
-WRITE DATA 20170902|0000000000000000381998|0000000000000000078161
-CLOSE
-RUN
FILEDEF MASTER DISK tmp.mas
-RUN
-WRITE MASTER FILENAME=TMP, SUFFIX=DFIX,$
-WRITE MASTER SEGMENT=TMP, SEGTYPE=S0,$
-WRITE MASTER FIELDNAME=TMP_DATE,,A8YYMD,A08,$
-WRITE MASTER FIELDNAME=TMP_TOTL,,D20.2M,A22,$
-WRITE MASTER FIELDNAME=TMP_CASH,,D20.2M,A22,$
-WRITE MASTER FIELDNAME=DELIMITER, ALIAS='|',A01,A01,$
-CLOSE
-RUN
FILEDEF TMP DISK tmp_data.txt
-RUN
DEFINE FILE TMP
H01_YY/YY = TMP_DATE;
H01_YYQ/YYQ = TMP_DATE;
H01_Q/Q = TMP_DATE;
H01_MNTH/MtY = TMP_DATE;
H01_DOW/Wtr = TMP_DATE;
H01_DATE/MtDYY = TMP_DATE;
-*
H01_RISK/D20.2M = TMP_TOTL - TMP_CASH;
-*
H01_RISK_PCT/P6.1 = (H01_RISK / TMP_TOTL) * 100;
H01_CASH_PCT/P6.1 = (TMP_CASH / TMP_TOTL) * 100;
-*
H01_DATEA/A55 = FPRINT(H01_DOW, 'Wtr', 'A9') || (', ' | FPRINT(H01_DATE, 'MtrDYY', 'A20'));
H01_TOTLA/A55 = FPRINT(TMP_TOTL, 'D20.2M', 'A30');
H01_RISKA/A55 = FPRINT(H01_RISK, 'D20.2M', 'A30') | ' (' | LJUST(10, FPRINT(H01_RISK_PCT, 'P6.1', 'A10'), 'A10') || '%)';
H01_CASHA/A55 = FPRINT(TMP_CASH, 'D20.2M', 'A30') | ' (' | LJUST(10, FPRINT(H01_CASH_PCT, 'P6.1', 'A10'), 'A10') || '%)';
END
-*
TABLE FILE TMP
PRINT
H01_YY
H01_YYQ
H01_Q
H01_MNTH
H01_DOW
H01_DATE
TMP_CASH
H01_CASH_PCT
H01_RISK
H01_RISK_PCT
TMP_TOTL
H01_DATEA
H01_TOTLA
H01_RISKA
H01_CASHA
BY H01_MNTH NOPRINT
BY HIGHEST 1 TMP_DATE NOPRINT
ON TABLE HOLD AS HLD_H01
END
? HOLD HLD_H01
-RUN
GRAPH FILE HLD_H01
SUM
TMP_CASH AS 'Cash'
H01_RISK AS 'Risk'
TMP_TOTL AS 'Total'
H01_DATEA
H01_TOTLA
H01_RISKA
H01_CASHA
BY H01_YY
BY H01_Q
BY H01_MNTH
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH BAR
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/combine_templates/ENWarm.sty,$
TYPE=REPORT, CHART-SERIES-LAYOUT=stacked,$
TYPE=DATA, COLUMN=N1, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N2, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N3, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N4, BUCKET=y-axis, $
TYPE=DATA, COLUMN=N5, BUCKET=y-axis, $
TYPE=DATA, COLUMN=N6, BUCKET=y-axis(2), $
TYPE=DATA, COLUMN=N7, BUCKET=tooltip, $
TYPE=DATA, COLUMN=N8, BUCKET=tooltip, $
TYPE=DATA, COLUMN=N9, BUCKET=tooltip, $
TYPE=DATA, COLUMN=N10,BUCKET=tooltip, $
*GRAPH_SCRIPT
setSeriesType(2,2);
setFillColor(getSeries(2),new Color(#e1542b));
setMarkerShape(getSeries(2),4);
setDisplay(getY2Title(),true);
*GRAPH_JS
legend: {position: 'bottom'},
xaxis: {
labels: { nestingConcatSymbol: null},
scroll: {
style: 'miniChart',
groups: {maxCount: 18},
miniChartProperties: {
height:40,
dataSelection:{selectionRect: {fill: 'rgba(112, 128, 144, 0.45)'}}
}
}
},
yaxis: {
labels: {visible: true, font: 'bold 8pt Sans-Serif'},
majorGrid: {visible:true, lineStyle: {width: 1,color: 'black'}}
},
*END
*GRAPH_JS_FINAL
xaxis: {
title: {visible: false}
},
y2axis: {
labels: {visible: false},
title: {visible: false, text: ''},
},
series: [
{series: 0,
tooltip: 'Date: [b]{{tooltip1}}[/b]<br><span style="background-color:#5388be">Cash</span>: [b]{{tooltip4}}[/b]'
},
{series: 1,
tooltip: 'Date: [b]{{tooltip1}}[/b]<br><span style="background-color:#9ed675">Risk</span>: [b]{{tooltip3}}[/b]'
},
{series: 2,
tooltip: 'Date: [b]{{tooltip1}}[/b]<br><span style="background-color:#e1542b">Total</span>: [b]{{tooltip2}}[/b]<br><span style="background-color:#9ed675">Risk</span>: [b]{{tooltip3}}[/b]<br><span style="background-color:#5388be">Cash</span>: [b]{{tooltip4}}[/b]'
},
]
*END
ENDSTYLE
END
This message has been edited. Last edited by: FP Mod Chuck,
WebFocus 8.201M, Windows, App Studio
June 25, 2018, 11:27 AM
Les J
Not sure about positioning the tool-tip, nothing I tried work but won't doing BY HIGHEST H01_YY give you you what you want?
WebFOCUS 8
Windows, All Outputs
June 25, 2018, 11:38 AM
jfr99
Yes ... That works but I was trying to keep it close to how the previous version of this looked using Highcharts.js ...
Thanks for the input, I may have to go that route.
WebFocus 8.201M, Windows, App Studio
June 25, 2018, 12:21 PM
jfr99
Hi Les,
If you change the LOOKGRAPH from BAR to AREA ... That is really the look that I want, but then the tooltips don't seem to work. I don't get a tooltip for the 'Total' series. Do you know how to get this to work better as an AREA map?