<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="author" content="Roderick Divilbiss">
<meta name="copyright" content="© 2005-2010 Roderick Divilbiss">
<title>bar chart JavaScript</title>
<script language="javascript" type="text/javascript">
<!--
// These arrays could be populated from a database
// using a server side scripting language, such as ASP/PHP/JSP
var scores = new Array();
scores[0]=77;
scores[1]=100;
scores[2]=83;
scores[3]=87;
scores[4]=91;
scores[5]=65;
scores[6]=89;
var names = new Array();
names[0]='John';
names[1]='Jessee';
names[2]='Judy';
names[3]='Jacob';
names[4]='Jessica';
names[5]='James';
names[6]='Julie';
var barchart1 ='<div style="position:absolute; width:100px; height:15px;">'+
'<div style="position:absolute; width:300px; height:15px; '+
'left:115px"><img border="0" src="images/scale300.gif" '+
'width="300" height="15"></div>Bar Chart</div><br>';
for (var idx=0;idx<scores.length; idx++) {
barchart1 = barchart1 + '<div style="position:absolute; width:100px;'+
' height:15px;"><div style="position:absolute; width:300px;'+
' height:15px; left:115px"><img border="0" '+
'src="images/1x15navy.gif" width="'+scores[idx]*3+
'" height="15"> '+scores[idx]+'</div>'+names[idx]+
'</div><br>';
}
//-->
</script>
</head>
<style>
#chart {
width: 600px;
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
<div id="chart"><script>document.write(barchart1);</script></div>
</body>
</html>
</body>
</html>
Date Validation Using JavaScript .
Cross-Browser Clipboard Copy .
Loading Images With Remote Scripting .
Why JavaScript In Hyperlinks Is Bad .
Change The Submit Button To Show Waiting For AJAX Response .
European Date Validation Using JavaScript .
Database Results To Client Side Array .
Reading Files With JavaScript .
AJAX For Plain Text And HTML .
