Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only.

Join the TIBCO Community
TIBCO Community is a collaborative space for users to share knowledge and support one another in making the best use of TIBCO products and services. There are several TIBCO WebFOCUS resources in the community.

  • From the Home page, select Predict: WebFOCUS to view articles, questions, and trending articles.
  • Select Products from the top navigation bar, scroll, and then select the TIBCO WebFOCUS product page to view product overview, articles, and discussions.
  • Request access to the private WebFOCUS User Group (login required) to network with fellow members.

Former myibi community members should have received an email on 8/3/22 to activate their user accounts to join the community. Check your Spam folder for the email. Please get in touch with us at community@tibco.com for further assistance. Reference the community FAQ to learn more about the community.



Read-Only Read-Only Topic
Go
Search
Notify
Tools
mouseover display
 Login/Join
 
Virtuoso
posted
I have a report like this

TABLE FILE WHATEVER
SUM SALES NOPRINT
NUMBER NOPRINT
COMPUTE AVSAL=SALES/NUMBER; NOPRINT
CNT.CLIENTS
BY COUNTRY
ACROSS DEPARTMENT
END


I can show all the fields, but that will be to much.
What I would like to see is something like

"Sales: xxx"
"number: yyy"
"average: bbb"
"perc total: x%"

In a little box when I click on the number in the report or even better when I do a mouse-over.
The box might have different colors depending on certain figures (above 10% is green, below 5% is red...)

Any idea how to do this?

After a click you can also drill down to an other report.




Frank

prod: WF 7.6.10 platform Windows,
databases: msSQL2000, msSQL2005, RMS, Oracle, Sybase,IE7
test: WF 7.6.10 on the same platform and databases,IE7

 
Posts: 2387 | Location: Amsterdam, the Netherlands | Registered: December 03, 2006Report This Post
Master
posted Hide Post
The technique seems to be - code it first as an HTML table and get that to work. Then code in wf with DEFINE file being used to build up the HTML string.

Unfortunately my HTML not good enough to give you the HTML code!



Server: WF 7.6.2 ( BID/Rcaster) Platform: W2003Server/IIS6/Tomcat/SQL Server repository Adapters: SQL Server 2000/Oracle 9.2
Desktop: Dev Studio 765/XP/Office 2003 Applications: IFS/Jobscope/Maximo
 
Posts: 888 | Location: Airstrip One | Registered: October 06, 2006Report This Post
Expert
posted Hide Post
Hi Frank,

A quick bit of code for you to play with. It has an advantage in that it builds a dynamic DIV for the message so the first thing it does is to destroy any existing one, so you do not have to "create" one in WF first.
The two commented lines in the script should work but the version of IE I have here doesn't like it so have a play.

DEFINE FILE CAR
  MODEL_OVER/A250 = '<a href='||''''||'javascript:CrMsgDiv("Country='
        ||COUNTRY||'<br>Model='||MODEL||'",200,50)'||''';>'||MODEL||'</a>';
END

TABLE FILE CAR
SUM RCOST
    DCOST
 BY COUNTRY
 BY CAR
 BY MODEL_OVER AS MODEL
ON TABLE SET HTMLCSS ON
ON TABLE HOLD AS MYHTML FORMAT HTMTABLE
END
-RUN

-HTMLFORM BEGIN
<html>
<head>
<title>Mouseover for Frank</title>
<script>
    function CrMsgDiv(text,width,height) {
      var RemDiv = document.getElementById('MsgDiv');
      if (RemDiv) {
        document.body.removeChild(RemDiv);
      }
      var MsgDiv = document.createElement('div');
      MsgDiv.setAttribute('id', 'MsgDiv');
      var MsgHTML = "<html><head></head><body>";
      MsgHTML+= "<table width=100% height=100% bgcolor=#f0f5ff style='BORDER-TOP:2px groove; ";
      MsgHTML+= "BORDER-LEFT:2px groove; BORDER-RIGHT:2px groove; BORDER-BOTTOM:2px groove; ";
      MsgHTML+= "FONT-WEIGHT:400; FONT-SIZE:10pt; FONT-STYLE:normal; FONT-FAMILY:MS Sans Serif; ";
      MsgHTML+= "TEXT-DECORATION:none;'><tr><td align=center>";
      MsgHTML+= text;
      MsgHTML+= "</td></tr></table></body></html>";
      MsgDiv.innerHTML = MsgHTML;
      document.body.appendChild(MsgDiv);
      MsgDiv.style.position='absolute';
//      MsgDiv.style.top=event.clientY + 10 + document.body.scrollTop;
//      MsgDiv.style.left=event.clientX + 10 + document.body.scrollLeft;
      MsgDiv.style.width=width;
      MsgDiv.style.height=height;
    }
</script>
</head>
<body>
!IBI.FIL.MYHTML;
</body>
</html>
-HTMLFORM END


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 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
Virtuoso
posted Hide Post
Frank

Here is a simple basis of something I ahve used in the past. I prefer the onclick event to the onmouseover.
TABLE FILE CAR
SUM     SALES
    CNT.SALES
COMPUTE
AVSAL/F8.2 = C1/C2;
COMPUTE
SPANBOX/A1000 = '<span> COUNTRY:'|COUNTRY|'<BR>SALES:'|EDIT(C1)|'<BR>COUNT:'|EDIT(C2)|'</span>';
BY COUNTRY
BY CAR
ON TABLE SAVE
END
-RUN
-SET &LOOP=&LINES;
-HTMLFORM BEGIN
<html>
<head>
<script language=javascript>
window.onload = init;
function init() {
  if (window.Event) {
    document.captureEvents(Event.MOUSEMOVE);
  }
  document.onmousemove = getXY;
}

function getXY(e) {
x = (window.Event) ? e.pageX : event.clientX;
y = (window.Event) ? e.pageY : event.clientY;
}
function textOver(msg){
textBox=document.getElementById("textbox");
textBox=document.getElementById("textbox");
textBox.style.top=y-10;
textBox.style.left=10;
textBox.innerHTML=document.getElementById(msg).innerHTML;
textBox.style.visibility='visible';
}

function textOut() {
textBox=document.getElementById("textbox");
textBox.innerHTML='<br>';
textBox.style.visibility='hidden';
}
</script>
</head>
<body>
<span id="textbox" onclick="javascript:textOut();" style="position:absolute;visibility:hidden;width:120px;height:200px;background-color:black;color:white;" ><br></span>
<div style="width:100%">
<table><tr>
<td style="width:200px">country</td>
<td style="width:150px">car</td>
</tr>
-SET &CNTR=0;
-REPEAT :LOOP &LOOP TIMES
-SET &CNTR=&CNTR+1;
-READ SAVE &CTRY.10 &CAR.16 &dum.19 &BOX.1000
<tr>
<td style=" " onclick="javascript:textOver('box_!IBI.AMP.CNTR;');">!IBI.AMP.CTRY;</td>
<td style=" ">!IBI.AMP.CAR;</td>
<td id="box_!IBI.AMP.CNTR;" style="display:none">!IBI.AMP.BOX;</td>
</tr>
-:LOOP
</table>
</div>
</body>
</html>
-HTMLFORM END


Alan.
WF 7.705/8.007
 
Posts: 1451 | Location: Portugal | Registered: February 07, 2007Report This Post
<Marcel Naumann>
posted
Frank,
a way is to create a new field and visualize it (.gif, .jpg) with an alternate attribute on it. This only works if your report is in HTML!

This is a classic one, have a good look at the concatenation here:

DEFINE FILE CAR
IMAGE/A150=IF SALES GT 10000 THEN ''<BR>|CAR<BR>|''
ELSE ''<BR>|CAR<BR>|'';
END

TABLE FILE CAR
PRINT IMAGE
BY COUNTRY
END

Since you edit a new field, you can do whatever with it, drilldowns etc.

You can also do this with JavaScript, not sure if you want to do this.

Nice pics of Summit on your site, by the way.

Best regards,
Marcel
 
Report This Post
Expert
posted Hide Post
Thanks Alan,

Your post reminded me why the div positioning didn't work Smiler

Frank,

The equivalent sample using mouseover events -
TABLE FILE CAR
PRINT
    COMPUTE RCOSTA/A17 =FTOA(RCOST, '(D12)', 'A17'); NOPRINT
    COMPUTE DCOSTA/A17 =FTOA(DCOST, '(D12)', 'A17'); NOPRINT
    COMPUTE MOUSE_OVER/A250 = '<img border=0 src=/ibi_html/point.gif width=10 height=18 onmouseover='
            ||''''||'javascript:CrMsgDiv("Model='||MODEL||'<br>Retail Cost='||RCOSTA
            ||'<br>Dealer Cost='||DCOSTA||'",200,50)'||'''; />';
    AS ''
 BY COUNTRY
 BY CAR
 BY MODEL NOPRINT
ON TABLE SET HTMLCSS ON
ON TABLE HOLD AS MYHTML FORMAT HTMTABLE
END
-RUN

-HTMLFORM BEGIN
<html>
<head>
<title>Mouseover for Frank</title>
<script>
window.onload = init;
    function init() {
      if (window.Event) {
        document.captureEvents(Event.MOUSEMOVE);
      }
      document.onmousemove = getXY;
    }

    function getXY(e) {
      x = (window.Event) ? e.pageX : event.clientX;
      y = (window.Event) ? e.pageY : event.clientY;
    }

    function CrMsgDiv(text,width,height) {
      var RemDiv = document.getElementById('MsgDiv');
      if (RemDiv) {
        document.body.removeChild(RemDiv);
      }
      var MsgDiv = document.createElement('div');
      MsgDiv.setAttribute('id', 'MsgDiv');
      var MsgHTML = "<html><head></head><body>";
      MsgHTML+= "<table width=100% height=100% bgcolor=#f0f5ff style='BORDER-TOP:2px groove; ";
      MsgHTML+= "BORDER-LEFT:2px groove; BORDER-RIGHT:2px groove; BORDER-BOTTOM:2px groove; ";
      MsgHTML+= "FONT-WEIGHT:400; FONT-SIZE:10pt; FONT-STYLE:normal; FONT-FAMILY:MS Sans Serif; ";
      MsgHTML+= "TEXT-DECORATION:none;'><tr><td align=center>";
      MsgHTML+= text;
      MsgHTML+= "</td></tr></table></body></html>";
      MsgDiv.innerHTML = MsgHTML;
      document.body.appendChild(MsgDiv);
      MsgDiv.style.position='absolute';
      MsgDiv.style.top=y + 10 + document.body.scrollTop;
      MsgDiv.style.left=x + 10 + document.body.scrollLeft;
      MsgDiv.style.width=width;
      MsgDiv.style.height=height;
    }
</script>
</head>
<body>
!IBI.FIL.MYHTML;
</body>
</html>
-HTMLFORM END


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 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
Virtuoso
posted Hide Post
This is very nice Tony,

May I make a couple of additions/changes.
TABLE FILE CAR
PRINT
    COMPUTE RCOSTA/A17 =FTOA(RCOST, '(D12)', 'A17'); NOPRINT
    COMPUTE DCOSTA/A17 =FTOA(DCOST, '(D12)', 'A17'); NOPRINT
    COMPUTE MOUSE_OVER/A250 = '<img border=0 src=/ibi_html/point.gif width=10 height=18 onmouseover='
            ||''''||'javascript:CrMsgDiv("Model='||MODEL||'<br>Retail Cost='||RCOSTA
            ||'<br>Dealer Cost='||DCOSTA||'",200,50)'||'''; />';
    AS ''
 BY COUNTRY
 BY CAR
 BY MODEL NOPRINT
ON TABLE SET HTMLCSS ON
ON TABLE HOLD AS MYHTML FORMAT HTMTABLE
END
-RUN

-HTMLFORM BEGIN
<html>
<head>
<title>Mouseover for Frank</title>
<script>
window.onload = init;
    function init() {
      if (window.Event) {
        document.captureEvents(Event.MOUSEMOVE);
      }
      document.onmousemove = getXY;
    }

    function getXY(e) {
      x = (window.Event) ? e.pageX : event.clientX;
      y = (window.Event) ? e.pageY : event.clientY;
    }

    function CrMsgDiv(text,width,height) {
      var RemDiv = document.getElementById('MsgDiv');
      if (RemDiv) {
        document.body.removeChild(RemDiv);
      }
      var MsgDiv = document.createElement('div');
      MsgDiv.setAttribute('id', 'MsgDiv');
// remove the html and body tags, not required.
      var MsgHTML = "<table width=100% height=100% bgcolor=#f0f5ff style='BORDER-TOP:2px groove; ";
      MsgHTML+= "BORDER-LEFT:2px groove; BORDER-RIGHT:2px groove; BORDER-BOTTOM:2px groove; ";
      MsgHTML+= "FONT-WEIGHT:400; FONT-SIZE:10pt; FONT-STYLE:normal; FONT-FAMILY:MS Sans Serif; ";
// add code to call hide function
      MsgHTML+= "TEXT-DECORATION:none;'><tr><td align=center onmouseout='javascript:hideMsgDiv()'>";
      MsgHTML+= text;
      MsgHTML+= "</td></tr></table>";
      MsgDiv.innerHTML = MsgHTML;
      document.body.appendChild(MsgDiv);
      MsgDiv.style.position='absolute';
      MsgDiv.style.top=y + 10 + document.body.scrollTop;
      MsgDiv.style.left=x + 10 + document.body.scrollLeft;
      MsgDiv.style.width=width;
      MsgDiv.style.height=height;
    }
// hide function, taken directly from Tony's create function!
    function hideMsgDiv() {
      var RemDiv = document.getElementById('MsgDiv');
      if (RemDiv) {
        document.body.removeChild(RemDiv);
      }
    }

</script>
</head>
<body>
!IBI.FIL.MYHTML;
</body>
</html>
-HTMLFORM END

(I don't know whether everyone will get it, but instead of the img tag on the MOUSE_OVER field, a div tag can be used instead, with a field value displayed.)

Thank you Tony.


Alan.
WF 7.705/8.007
 
Posts: 1451 | Location: Portugal | Registered: February 07, 2007Report This Post
Expert
posted Hide Post
Thanks Alan, I didn't have too much time to throw this together so I grabbed some of my "standard" scripts that I use frequently. The ones I grabbed on this occasion and threw together just happened to combine some code for a new window as well as a dynamic div.

I shall have to add this as one of my collection which I shall have to organise one day Smiler

T
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
Virtuoso
posted Hide Post
Alan, Tony

Great suggestions I got here, a lot to test tomorrow and I hope I can build it in my application.
If it all works as I had in mind I will come back to you.

Thanks




Frank

prod: WF 7.6.10 platform Windows,
databases: msSQL2000, msSQL2005, RMS, Oracle, Sybase,IE7
test: WF 7.6.10 on the same platform and databases,IE7

 
Posts: 2387 | Location: Amsterdam, the Netherlands | Registered: December 03, 2006Report This Post
Virtuoso
posted Hide Post
Marcel

Your suggestion is nice but it's not exactly what I had in mind.

How about your pictures from the Grand Canyon?




Frank

prod: WF 7.6.10 platform Windows,
databases: msSQL2000, msSQL2005, RMS, Oracle, Sybase,IE7
test: WF 7.6.10 on the same platform and databases,IE7

 
Posts: 2387 | Location: Amsterdam, the Netherlands | Registered: December 03, 2006Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic


Copyright © 1996-2020 Information Builders