graph chart

Stacked Vertical Bar Graph Examples

Applet Example 7

This example demonstrates how the applet is able to interact with javascript functions within the current page. In the graph below clicking on the Bar Segments or Product names within the legend will execute a javascript function which will either show or hide a table of data for that data series.

and here is the HTML code for the applet
(note that 'mayscript' has been added to the APPLET tag ),

<applet code="SVbarchartApplet.class" archive="SVbarchart.jar" width="400" height="400" mayscript>
<!-- Start Up Parameters -->
<PARAM name="LOADINGMESSAGE" value="Creating Chart - Please Wait."> <!-- Message to be displayed on Startup -->
<PARAM name="STEXTCOLOR" value="0,0,100"> <!-- Message Text Color-->
<PARAM name="STARTUPCOLOR" value="255,255,255"> <!-- Applet Background color -->

<!-- Data files -->
<PARAM name="chartproperties" value="barpropsjs.txt">
<PARAM name="chartdata" value="bardatajs.txt">

</applet>

 

The configuration parameters are taken from the text file barpropsjs.txt ( click here to view )
and the graph data is read from the text file bardatajs.txt ( click here to view )

If you "right click" and view source of this page you will see that we have the following javascript function within the page which is able to act upon the three tables, "c1", "c2" and "c3".

<SCRIPT LANGUAGE="JavaScript">

var table='c1';
function combo(table) {

if (table=='c1') {
if (document.all.c1.style.visibility=="hidden") {
document.all.c1.style.visibility="visible";
}
else {document.all.c1.style.visibility="hidden";}
}

if (table=='c2') {
if (document.all.c2.style.visibility=="hidden") {
document.all.c2.style.visibility="visible";
}
else {document.all.c2.style.visibility="hidden";}
}

if (table=='c3') {
if (document.all.c3.style.visibility=="hidden") {
document.all.c3.style.visibility="visible";
}
else {document.all.c3.style.visibility="hidden";}
}

}

</script>

In the bardatajs.txt ( click here to view ) file you will see that each of our data elements has the word "javascript" entered in the target field and the javascript function name with the relevant value entered in the URL field.

 

Note: If you are using the evaluation version then in the applet a pop-up window will appear upon the startup and an evaluation message will be incorporated by the servlet. Both these features have been removed from the licensed version. Licensing information can be found at http://www.jpowered.com/graph_chart/index.htm

 

 

 

<< back to Examples Index

<< back to Getting Started

Getting Started

Documentation

Examples

Tutorials

Common Problems

Purchase

Bar Graph Home

 

Graph & Charting

Pie Chart
Line Graph
Stacked Vertical Bar Graph
Stacked Bar Graph
Horizontal Bar Graph
more...

 

Advanced Data Grid Control