Hi, Im using App Studio 8207.18 and created COMPUTES (shown...

[Carol Sundy]

Hi,

Im using App Studio 8207.18 and created COMPUTES (shown below) in a .mas file to convert seconds into an A8 to show as HH:MM:SS format with the goal to chart it. I have this issue: I can chart Average Speed of Answer Seconds but I cant chart Average Speed of Answer Time in the format A8.

I can use Average Speed of Answer Time in the tooltip and I can show it in a report, but I dont know how to use it in a chart.

Is there a better way to Convert seconds to HH:MM:SS Thanks.

This compute is the base calculation for the time in seconds:

COMPUTE AVERAGE_SPEED_OF_ANSWER/I12 MISSING ON ALL=ROUND(( TANSWERED / NANSWERED), 2);,

TITLE=Average Speed of Answer Seconds, DESCRIPTION=This is tAnswered / nAnswered, $

This compute uses Average Speed of Answer Seconds and calculates as HH:MM:SS and stores as an integer :

COMPUTE COMP_HHMMSS/I6 MISSING ON ALL=(INT( AVERAGE_SPEED_OF_ANSWER / 3600 ) * 10000) +

(INT( IMOD( AVERAGE_SPEED_OF_ANSWER, 3600, I4 ) / 60 ) * 100) +

(IMOD( AVERAGE_SPEED_OF_ANSWER, 60, I2 ));,

TITLE=AverageSpeedOfAnswer HHMMSS, $

This compute uses AverageSpeedOfAnswer HHMMSS and displays as HH:MM:SS and stores as an A8:

COMPUTE COMP_AVG_FINAL/A8 MISSING ON ALL=EDIT( COMP_HHMMSS, 99:99:99);,

TITLE=Average Speed of Answer Time, $

Thank you.

[Warren Hinchliffe]

I would suggest creating a datetime field with HADD, and supply the date time field by using HINPUT with the seed 0000/00/00 00:00:00.

The HADD can then increment the date time in any of the valid values like second, minute etc. You can even go down to milli, micro or nano seconds.

With the date time field, you should be able to chart it and keep the order correct

https://webfocusinfocenter.informationbuilders.com/wfappent/TLs/TL_lang/source/hadd.htm

https://webfocusinfocenter.informationbuilders.com/wfappent/TLs/TL_lang/source/hinput.htm

[Carol Sundy]

Thank you. I will check it out.

[David Beagan]

carol.sundy:

 

Is there a better way to Convert seconds to HH:MM:SS

 

 

I was thinking, couldnt WebFOCUS figure out how to do the calculation The code below is what I came up with. I didnt try this as COMPUTEs in a Master file for a relational DB, but it seem like it should work.

TABLE FILE ibisamp/ggsales

PRINT SEQ_NO/I5C AS 'Average,Seconds'

COMPUTE Time0/HHIS = '00:00:00'; AS 'Time,Zero'

COMPUTE HHMMSS/HHIS = HADD(Time0, 'SECOND', SEQ_NO, 8, 'HHIS'); AS 'Average,Seconds,hh:mm:ss'

COMPUTE HHMMSS_A8/A8 = HCNVRT(HHMMSS, '(HHIS)', 8, 'A8'); AS 'Alpha,hh:mm:ss'

WHERE SEQ_NO FROM 3595 TO 4010

ON TABLE SET PAGE NOLEAD

END

 

 

I have something for charting with the HHMMSS values which I will post shortly.

[David Beagan]

carol.sundy:

 

I dont know how to use it in a chart.

 

 

The following code creates a chart with the Y-axis based on the number of seconds for each region. The number of seconds on the Y-axis are converted by JavaScript code: new Date(seconds * 1000).toISOString().substr(11, 8);

into an hh:mm:ss presentation format, for both the axis labels and tooltip. You can run this code to try it out:

GRAPH FILE ibisamp/ggsales

SUM SEQ_NO AS ''

BY REGION AS ''

WHERE SEQ_NO EQ 4374 OR 4173

OR 4245 OR 4317

ON GRAPH PCHOLD FORMAT JSCHART

ON GRAPH SET LOOKGRAPH VBAR

ON GRAPH SET AUTOFIT ON

ON GRAPH SET STYLE *

*GRAPH_SCRIPT

setTextRotation(getO1Label(), 4);

setFillColor(getSeries(0),new Color(255,140,098));

setFillColor(getSeries(1),new Color(255,140,098));

setFillColor(getSeries(2),new Color(255,140,098));

setFillColor(getSeries(3),new Color(255,140,098));

*GRAPH_JS

border: { color:"transparent"},

xaxis: { "majorGrid": { "ticks": { "visible": false } } },

yaxis: { intervalMode: "count",

intervalValue: 8,

baseLineStyle: { color:"#999999" },

majorGrid: { visible: true,

ticks: false,

aboveRisers: false,

lineStyle: { width: 1,

color:"#dddddd",

},

},

numberFormat: function(seconds) {

return new Date(seconds * 1000).toISOString().substr(11, 8);

},

},

series: [ {series: 'reset',

tooltip: function(seconds, x, group) {

return 'Region: <b>' + this.getGroupLabel(group) + '</b><br>' +

'Time: <b>' + new Date(seconds * 1000).toISOString().substr(11, 8);

}

} ],

 

*END

ENDSTYLE

END

 

 

image.png827655 21.7 KB

[Carol Sundy]

David,

Thank you very much for the JavaScript code. I was able to use it with my chart and it worked! JavaScript is very powerful. Do you know if its possible to use the Time values as HH:MM:SS for yaxis data labels too

Thanks again for the example you provided! Carol

[David Beagan]

Carol, not sure what you are asking. You would like to see the time values for each bar above the bar

[Carol Sundy]

David, yes I would like to see the time values for each bar above the bar Thanks.

[David Beagan]

Try this code. See the part starting with dataLabels:

GRAPH FILE ibisamp/ggsales

SUM SEQ_NO

BY REGION

WHERE SEQ_NO EQ 4374 OR 4173

OR 4245 OR 4317

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/ibi_themes/Warm.sty,$

type=data, column=n2, bucket=y-axis,$

type=data, column=n1, bucket=x-axis,$

*GRAPH_JS

border: { color: "transparent"},

xaxis: { majorGrid: { ticks: { visible: false } } },

yaxis: { intervalMode: "count",

intervalValue: 8,

baseLineStyle: { color:"#999999" },

majorGrid: { visible: true,

ticks: false,

aboveRisers: false,

lineStyle: { width: 1,

color:"#dddddd",

},

},

numberFormat: function(seconds) {

return new Date(seconds * 1000).toISOString().substr(11, 8);

},

},

series: [ { series: "reset",

dataLabels: {

visible: true,

position: "top",

font: "7pt Sans-Serif",

content: function(d, s, g, n) {

return 'Ave. Speed<br>' +

new Date(d.y * 1000).toISOString().substr(11, 8);

}

}

}

]

*GRAPH_JS_FINAL

"yaxis": { "title": { "visible": false}},

"xaxis": { "title": { "visible": false}}

*END

ENDSTYLE

END

[Carol Sundy]

David,

Thanks again for providing the sample code to add the values above the bars. I was able to use the sample code in my chart and it works! I really appreciate the time you took to help me solve my issue.

Carol

[David Beagan]

You are welcome. Glad it worked for you.

[Carol Sundy]

Hi David,

I was able to use your code in 2 of my charts that display weekly and daily values on 1 line to format my yaxis, tooltips and series content as HHMMSS. Thank you again. I have a 3rd chart that displays the same values by month. It is slightly different from the other 2 charts because it shows the monthly data on 2 lines. 1 line per year. I create this line separation by using the Color on Year feature. TYPE=DATA, COLUMN=N1, BUCKET=color, $. With the code below I can format the yaxis and the tooltip but not the content. It shows the seconds. (there is 1 value for 2020, Dec and 5 for 2021, Feb - Jun)

 

When I include this line for content: content: function(d, s, g, n)

{return new Date(d.y * 1000).toISOString().substr(11, 8); }

I receive an Internal Error: RangeError: Invalid time value message.

 

Ive been looking at documentation on using the callback functions and am wondering if the values need to be changed. Do you know if the code content needs to be changed to format as HHMMSS

Thank you.

GRAPH FILE BV_CC

-* Created by Info Assist for Graph

SUM COMPUTE BV_CC.PWB_CC.AVERAGE_SPEED_OF_ANSWER; AS Average Speed

BY BV_CC.PWB_CC.PROCESS_DATE_YEAR AS Year

BY BV_CC.PWB_CC.PROCESS_DATE_MONTH AS Month NOPRINT

BY BV_CC.PWB_CC.PROCESS_DATE_MONTH_NAME AS Month

WHERE BV_CC.PWB_CC.PROCESSDATEKEY GT BV_CC.DWT_CALENDAR.DEF_PREV25MONTHEND;

ON GRAPH PCHOLD FORMAT JSCHART

ON GRAPH SET VZERO 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 LOOKGRAPH LINE

ON GRAPH SET AUTOFIT ON

ON GRAPH SET STYLE *

*GRAPH_SCRIPT

setPieDepth(0);

setPieTilt(0);

setDepthRadius(0);

setPlace(true);

setUseSeriesShapes(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=color, $

TYPE=DATA, COLUMN=N2, BUCKET=x-axis, $

TYPE=DATA, COLUMN=N3, BUCKET=x-axis, $

TYPE=DATA, COLUMN=N4, BUCKET=y-axis, $

*GRAPH_SCRIPT

*GRAPH_JS_FINAL

yaxis: { intervalMode: count,

intervalValue: 8,

baseLineStyle: { color:"#999999" },

majorGrid: { visible: false,

ticks: false,

aboveRisers: false,

lineStyle: { width: 1,

color:"#dddddd",

},

},

numberFormat: function(seconds)

{ return new Date(seconds * 1000).toISOString().substr(11, 8); },

},

series: [ {

"series": "all",

"marker": {"fillEffect": "seriesFill"} ,

 

series: reset,

tooltip: function(seconds, x, group) {

return 'Month: + this.getGroupLabel(group) + +

'Average Speed: + new Date(seconds * 1000).toISOString().substr(11, 8);

},

dataLabels: {

visible: true,

position: top,

font: 10pt Sans-Serif,

content: function(d, s, g, n)

{return new Date(d.y * 1000).toISOString().substr(11, 8); }

},

} ],

*GRAPH_JS_FINAL

yaxis: { title: { visible: false}},

xaxis: { title: { visible: true}}

*END

ENDSTYLE

END

-RUN

[David Beagan]

I was able to reproduce your error with the ggsales file. It seems that the .toISOString() is causing an issue. I commented it out and used calculations to to get the hh:mm:ss. Maybe this will work better for you:

DEFINE FILE ggsales

OFFSET/I3 = EDIT('&DATEJUL','$$$999');

DateYYMD/YYMD = AYMD(&DATEH8,-SEQ_NO-OFFSET,'I8YYMD');

DateYY/YY = DateYYMD;

DateM/M = DateYYMD;

END

 

GRAPH FILE ggsales

SUM SEQ_NO

BY DateYY

BY DateM

WHERE SEQ_NO FROM 1 TO 730;

ON GRAPH PCHOLD FORMAT JSCHART

ON GRAPH SET LOOKGRAPH LINE

ON GRAPH SET AUTOFIT ON

ON GRAPH SET STYLE *

TYPE=DATA, COLUMN=N1, BUCKET=COLOR, $

TYPE=DATA, COLUMN=N2, BUCKET=x-axis, $

TYPE=DATA, COLUMN=N3, BUCKET=y-axis, $

*GRAPH_JS_FINAL

series: [ {

"series": "all",

"series": "reset",

"dataLabels": {

"visible": true,

"content": function(d, s, g) {

var hrs = Math.floor(d.y / 3600);

var min = Math.floor((d.y - (hrs * 3600)) / 60);

var sec = d.y - (hrs * 3600) - (min * 60);

sec = Math.round(sec * 100) / 100

var result = (hrs < 10 "0" + hrs : hrs);

result += ":" + (min < 10 "0" + min : min);

result += ":" + (sec < 10 "0" + sec : sec);

-* var result = new Date(d.y * 1000).toISOString().substr(11, 8);

return result

}

},

} ],

*END

ENDSTYLE

END

[Carol Sundy]

Hi David,

Thank you once again for the time you have taken to look at this. Im learning a lot from your examples of code. I was able to add the code you provided for content to my chart. It works and shows the formatted values on both lines. However, it adds NaN:NAH:NaN across the top. Please see the screen shot below.

 

Ive been researching NaN and its not a number. I looked at your example from ggsales and noticed that you have a WHERE clause WHERE SEQ_NO FROM 1 TO 730; If I comment that out, I receive NaN:NAH:NaN at the top of the ggsales. When I limit my months to just 1 year (2020 or 2021) it displays without the NaN:NAH:NaN. But when I add both years in it displays NaN:NAH:NaN. I was wondering if I could please ask you if you have any ideas to eliminate the NaN:NAH:NaN with 2 lines

Thanks, Carol

[David Beagan]

Ah, now I think I understand better. The NaN values are caused by some of the d.y values being undefined. These undefined values were causing the error with .toISOString and so maybe we can go back to the original calculation, with testing for undefined:

series: [ {

"series": "all",

"series": "reset",

"dataLabels": {

"visible": true,

"content": function(d, s, g) {

if (typeof d.y !== 'undefined')

{var result = new Date(d.y * 1000).toISOString().substr(11, 8)}

else {var result =' '};

return result;

}

},

} ],

[Carol Sundy]

Hi David,

The new code worked! Once again, many thanks for providing all of these examples. You have taught me a lot and expanded my knowledge about this product.

Thanks! Carol