<HTML>
<HEAD>
<TITLE>The Bar Chart</TITLE>

<SCRIPT LANGUAGE = JavaScript>
	//Identify data to be plotted
		var xData = new Array('StLouis','Vancouver','Mons','Trier','Nairobi','Phan Rang')
		var yData = new Array(80,160,320,640,1280,262)
		var nBars = 6
		var plotTitle = "Plant Capacity"

	//Plot parameters
		//note the next statement is one that will be concatenated with other parameters in a later function
			var blackPen = "<img src='http://www.umsl.edu/~sauter/DSS/javasamples/images/black.gif' align='middle' height=" 
		//some options are being set;  they could be variables too
			var plotWidth = 500
			var barHeight = 30
			var barGap = barHeight/4
			var barWidths = new Array(nBars)


function maxOfArray(theArray, itsLength)
		//this function is called from the function computeBarWidths
{
   var maxArray = -10000
   		// this is an arbitrary, but small number
   for (var i = 0; i < itsLength; i++)
   		//this is a "do" loop ... for 1 = 0 to L, where L is the number of items in the list;  increment by 1
   		// each value gets compared to the current largest value and replaces it if it is larger
		// the goal is to find the largest value in the dataset
      if (theArray[i] > maxArray)
         maxArray = theArray[i]

   return maxArray
}

function minOfArray(theArray, itsLength)
		//this function is called from the function computeBarWidths
{
   var minArray = 10000
   		// this is an arbitrary, but large number
   for (var i = 0; i < itsLength; i++)
   		//this is a "do" loop ... for 1 = 0 to L, where L is the number of items in the list;  increment by 1   
   		// each value gets compared to the current largest value and replaces it if it is smaller
		// the goal is to find the smallest value in the dataset
	     if (theArray[i] < minArray)
         minArray = theArray[i]

   return minArray
}

function computeBarWidths()
	//this function is called from the function "do bar"
	
{
   var maxData = maxOfArray(yData, nBars)
   		//identify the larger of the two
		//max is a method of "math"
   var minData = minOfArray(yData, nBars)
   		//identify the larger of the two
		//max is a method of "math"
   var dataRange = maxData - minData
   		//compute the range for the bar chart
   for (var i = 0; i < nBars; i++)
      barWidths[i] = Math.floor( 
         (yData[i]-minData) / maxData * plotWidth )     
		 //floor is a method of math that rounds to the nearest integer
		 //this computes the width of the bars as a function of how much data you have
}

function doBar()
{
   document.write("<CENTER><B>"+plotTitle+
      "</B></CENTER><P>")
	  		//this prints the title

   computeBarWidths()

   var i, j
   for (i = 0; i < nBars; i++)
   {
      document.write("<pre>" + 
         blackPen + barGap + " width=1><br>")
		 	//the value of blackPen was set earlier
      document.write(blackPen + barHeight +
         " width=" + parseFloat(barWidths[i])+">")
      if (yData[i] > 1000)
	  		//if the value of y is greater than 1000, print it bold
         document.write("<B>")
      document.write(" "+ xData[i]+": "+yData[i]+"<br>")
	  		//prints the values of x, a colon and the value of y
      if (yData[i] > 1000)
         document.write("</B>")
   }
   document.write(blackPen + barGap + 
      " width=1><br></pre>")
}

</SCRIPT>
</HEAD>
<BODY TEXT="#000000" link="000000" VLINK="#000000" BACKGROUND="background.jpg">
<FONT FACE="ARIAL">
<CENTER>
<H2>
<FONT FACE="Beehive"><FONT COLOR="#C100C1"><FONT SIZE=+4>A Sample DSS</FONT></FONT></FONT></H2></CENTER>



<P>
<SCRIPT LANGUAGE = JavaScript>
doBar()
</SCRIPT>

<p><hr><p>
<h5><dd><script>
//Always begin your Javascript component with the key word script
//Always document your programs!
//
//  This part of the program prints out the location where the page is actually put.
//
where = document.location
document.write('<i>URL:</i>' + where)

// Always end your Javascript component with the key word /script.
</script>

<dd>Page Owner:  <a href="http://www.umsl.edu/~sauter/" onclick="nextPage='My Home Page'">Professor Sauter</a> (<a href="mailto:Vicki_Sauter@umsl.edu">Vicki.Sauter@umsl.edu</a>)<br>
<dd><SCRIPT LANGUAGE = "JavaScript">
when = document.lastModified
document.write("Last Modified: " + when)
</script></dl>
</body>
</html>

</BODY>
</HTML>