Focal Point
[CLOSED] How do I set a group label in a *GRAPH_JS?

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

January 24, 2019, 03:29 PM
John_Edwards
[CLOSED] How do I set a group label in a *GRAPH_JS?
I have code to spiff up the tool-tips on my graph, but I get it that way by piggy-backing information in the BY field. So my BY field looks like this -- 01/18/2019@000004143@000000563.

Once I have the numbers off of the end I want to cut the field back to the date in the first ten characters. I have been able so set and get values on other things, but I can't set the label value. I get some errors that seem to indicate that maybe it's switched off, but I thought I'd consult the A team on this one. My *GRAPH_JS code:

*GRAPH_JS
legend: {visible:false},
series: [
   {series: 0, color: 'blue',
            tooltip: function(d, s, g) {

                  Corrections_Today = this.getGroupLabel(g).substr(21,9);
                  Corrections_Today = this.formatNumber(Corrections_Today, '###,###,###.');

                  Corrections_To_Date = this.getGroupLabel(g).substr(11,9);
                  Corrections_To_Date = this.formatNumber(Corrections_To_Date, '###,###,###.');

//                  setGroupLabel(0, "test");

  		       return ' Date: ' + this.getGroupLabel(g).substr(0,10) + '<br>'
			        + ' Corrections Today: ' + Corrections_Today + '<br>'
		            + ' Corrections To Date: ' + Corrections_To_Date}},

]
*END


The commented-out line throws an error. The question is this, how can you use the setGroupLabel value?

Option 2 would be to find another way to deliver the two numbers to the tool-tips text.

This message has been edited. Last edited by: FP Mod Chuck,



January 25, 2019, 04:10 AM
Tony A
Hi John,

If you look back at the post you previously made asking this question, you will notice that David Briars was using the series label for his LEGEND field whereas you are trying to use the group.

My suggestion would be to use browser developer tools, set a breakpoint at your callout function and determine what is being passed to each of the values in your function.

T


In FOCUS
since 1986		WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
January 25, 2019, 10:35 AM
John_Edwards
Understand your suggestion. But the problem is that the function isn't even being recognized. The error shows an unrecognized command, not an issue with the arguments sent to it.

I may be doing something that is not permitted. It may be unreasonable to use a set command inside a function to return a value to the tool tip. I may need to specify another section of code for the series for the Group Label. Don't know, still playing with it.



January 25, 2019, 12:02 PM
Tony A
What chart are you using?

If it is an HTML5 extension then not all of them are coded to accept this type of code.

If it is a standard moonbeam chart then post some example code that shows a similar result (using one of the sampple tables) so that we can see the entire process.

T


In FOCUS
since 1986		WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
January 25, 2019, 02:19 PM
John_Edwards
This is where I am now and I'm getting a TypeError: Unable to get property 'getDataValue' of undefined or null reference error.

var x = this.getSeries();
Corrections_Today = x.getDataValue(getSeriesGroup(1,g));

It seems to want to use the getDataValue function, but I can't get a handle on the object I want it to pull it from. This is an attempt to pull it from a field instead, since it appears impossible to change the group label without losing the data in it before I can grab it. I don't see any examples of people using the getDataValue function in javascript in the forums, and the documentation is pretty vague on the subject. It may be that my location in the code graph doesn't have visibility outside of itself.

I'm just that close, but can't kick it off.



January 28, 2019, 03:36 PM
John_Edwards

-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';
-DEFAULTH &WF_TITLE='WebFOCUS Report';

DEFINE FILE GGSALES
  LICENSES_CORRECTED_THIS_DAY/I9CS = IF LAST UNITS EQ 0 THEN 0
                                   ELSE LAST UNITS - UNITS;
  CUMULATIVE_LICENSES_CORRECTED/I9CS = IF LAST CUMULATIVE_LICENSES_CORRECTED EQ 0 THEN LICENSES_CORRECTED_THIS_DAY
                                       ELSE LAST CUMULATIVE_LICENSES_CORRECTED + LICENSES_CORRECTED_THIS_DAY;
END

DEFINE FILE GGSALES ADD
  LEGEND/A100 = EDIT(EDIT(DATE), '$$$$99/99/') | EDIT(EDIT(DATE), '9999') | '@' | EDIT(CUMULATIVE_LICENSES_CORRECTED) | '@' | EDIT(LICENSES_CORRECTED_THIS_DAY);
END

GRAPH FILE GGSALES
SUM CUMULATIVE_LICENSES_CORRECTED AS 'Licenses Corrected To-Date (Cumulative)'
-*    COMPUTE TEXT_TO_GRAB/A100 = EDIT(DATECVT(DATE_RECORDED, 'MDYY', 'A8MDYY'), '99/99/9999') | '@' | EDIT(CUMULATIVE_LICENSES_CORRECTED) | '@' | EDIT(LICENSES_CORRECTED_THIS_DAY); NOPRINT
-*    LICENSES_CORRECTED_THIS_DAY
BY LEGEND AS ''
WHERE LEGEND CONTAINS '04/01/1997';
WHERE RECORDLIMIT EQ 15;
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
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 GRMERGE ADVANCED
ON GRAPH SET GRMULTIGRAPH 0
ON GRAPH SET GRLEGEND 0
ON GRAPH SET GRXAXIS 1
ON GRAPH SET LOOKGRAPH VBAR
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_JS
legend: {visible:false},
series: [
   {series: 0, color: 'blue',
            tooltip: function(d, s, g) {

                  Corrections_Today = this.getGroupLabel(g).substr(21,9);
                  Corrections_Today = this.formatNumber(Corrections_Today, '###,###,###.');

                  Corrections_To_Date = this.getGroupLabel(g).substr(11,9);
                  Corrections_To_Date = this.formatNumber(Corrections_To_Date, '###,###,###.');

//                  this.setGroupLabelArray("test");

  		       return ' Date: ' + this.getGroupLabel(g).substr(0,10) + '<br>'
			        + ' Corrections Today: ' + Corrections_Today + '<br>'
		            + ' Corrections To Date: ' + Corrections_To_Date},
    }
]

*END
*GRAPH_SCRIPT
groupLabels: 'Series One Three'
setPieDepth(0);
setPieTilt(0);
setDepthRadius(0);
setCurveFitEquationDisplay(false);
setPlace(true);
*END
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/ENIADefault_combine.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, $
*GRAPH_SCRIPT
setReportParsingErrors(false);
setSelectionEnableMove(false);
setTextRotation(getO1Label(),3);
setColorMode(1);
setTextString(getO1Title(),"");
setLabelColor(get01Label(),new Color(255,255,255));
setFillColor(getFrame(),new Color(255,255,255));
setFillColor(getSeries(1),new Color(235,235,235));
*END
ENDSTYLE
END
-RUN




January 28, 2019, 03:46 PM
John_Edwards
So that's my source code, adjusted to run on GGSales. It produces a set of blue bars with value-added tooltips.

Each group needs to have its own data provisioned, so I'm using the group label. I need to use something that is group-specific. If I could find a way to reset the group label after capturing the data, or to hide the second half of the group label, I would be set. But I can't figure out how to do either. With html you can cheat by putting the extra material inside of tags so it doesn't show up, but that's not an option in the graph as best I can tell.



January 29, 2019, 12:10 PM
Tony A
Hi John,

Sometimes you need to go back to the GUI and remember what is possible using the GUI - such as adding columns to Tooltips with custom titles etc.

Check out this post from Sept 2017 that may give you some ideas so that you do not have to mess with your displayed grouping.

T


In FOCUS
since 1986		WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
January 29, 2019, 12:22 PM
Tony A
To expand on that a little, the following code possibly gives you what you are after.

DEFINE FILE GGSALES
  LICENSES_CORRECTED_THIS_DAY/I9CS = IF LAST UNITS EQ 0 THEN 0
                                   ELSE LAST UNITS - UNITS;
  CUMULATIVE_LICENSES_CORRECTED/I9CS = IF LAST CUMULATIVE_LICENSES_CORRECTED EQ 0 THEN LICENSES_CORRECTED_THIS_DAY
                                       ELSE LAST CUMULATIVE_LICENSES_CORRECTED + LICENSES_CORRECTED_THIS_DAY;
  LEGEND/A100 = EDIT(EDIT(DATE), '$$$$99/99/') | EDIT(EDIT(DATE), '9999') | '@' | EDIT(CUMULATIVE_LICENSES_CORRECTED) | '@' | EDIT(LICENSES_CORRECTED_THIS_DAY);
  DISPDATE/MDYY = DATE;
END
ENGINE INT CACHE SET ON
SET PAGE-NUM=NOLEAD
-DEFAULTH &WF_HTMLENCODE=ON;
SET HTMLENCODE=&WF_HTMLENCODE
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 GGSALES
-* Created by Info Assist for Graph
SUM GGSALES.SALES01.CUMULATIVE_LICENSES_CORRECTED AS 'Licenses Corrected To-Date (Cumulative)'
GGSALES.SALES01.DISPDATE AS 'Date'
GGSALES.SALES01.LICENSES_CORRECTED_THIS_DAY AS 'Corrections Today'
GGSALES.SALES01.CUMULATIVE_LICENSES_CORRECTED AS 'Corrections to date'
BY GGSALES.SALES01.LEGEND NOPRINT
BY GGSALES.SALES01.DISPDATE AS ''
WHERE GGSALES.SALES01.LEGEND CONTAINS '04/01/1997';
WHERE RECORDLIMIT EQ 15;
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET VZERO OFF
ON GRAPH SET GRWIDTH 1
ON GRAPH SET AUTOFIT ON
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=endeflt.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, $
TYPE=DATA, COLUMN=N1, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N2, BUCKET=x-axis, $
TYPE=DATA, COLUMN=N3, BUCKET=y-axis, $
TYPE=DATA, COLUMN=N4, BUCKET=tooltip, $
TYPE=DATA, COLUMN=N5, BUCKET=tooltip, $
TYPE=DATA, COLUMN=N6, BUCKET=tooltip, $
*GRAPH_SCRIPT
setSelectionEnableMove(false);
setReportParsingErrors(false);
groupLabels: 'Series One Three'
setTextRotation(getO1Label(),3);
setColorMode(1);
setTextString(getO1Title(),"");
setLabelColor(get01Label(),new Color(255,255,255));
setFillColor(getFrame(),new Color(255,255,255));
setFillColor(getSeries(1),new Color(235,235,235));
*END
*GRAPH_JS_FINAL
"series": [
	{"series": 0, 
		"tooltip": 'Date: {{tooltip1}}<br>Corrections Today: {{tooltip2}}<br>Corrections to date: {{tooltip3}}'
	}
]
*END
ENDSTYLE
END
-RUN


T


In FOCUS
since 1986		WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
January 29, 2019, 02:36 PM
John_Edwards
First of all, thank you!

But it's throwing errors for me. I'm on 8.1. I'll need to debug, or figure out what you did differently to make it work and figure out how to include that into my code without seeing your result. I'm assuming you understood my ravings and actually know what I'm looking for.

I sure wish the forums had a feature for including images. It would help a lot if I could set what other people's results looked like easily.



January 30, 2019, 02:59 AM
Tony A
I think the tooltip "bucket" came about from 8.2 Frowner

This is what it produces.



T


In FOCUS
since 1986		WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
January 30, 2019, 02:54 PM
John_Edwards
Yep, that's what I'm looking for. But I'm on 8.1, so that's not going to dig me out of this hole.

Good to know there's hope for next year!