Helpful Information
 
 
Category: Client side development
Using Javascript can Bar charts be drawn

For evaluation of Testing a section, I want to use bar charts which displays the score of each topic in a test attended.
Can bar charts or any graphics can be drawn for evalution using javascript.
If yes, what method or procedure should be implemented.

Sure, check out these examples:

http://asp.xcentrixlc.com/john/examples/dynamic%20graph/jsgraph.htm

As I am just starting to learn I can’t create something, but I did find this and it’s free!
http://www.play-free-games.com/webmasters/dynamic-bar-charts/dynamic-bar-chart.cfm
HTH:)
Just add this to your HTML and configure parameters as needed.
FYI, the credit link at the top of the code is a dead link.
<------------------------------------------------------------------------------>

<APPLET CODEBASE="http://www.play-free-games.com/webmasters/dynamic-bar-charts" CODE="barchart.class" HEIGHT=180 WIDTH=360>
(You can alter the height and width to whatever you want)
<PARAM NAME=NumberOfVals VALUE=4>
(This parameter sets the number of bars per column)
<PARAM NAME=NumberOfCols VALUE=5>
(Sets the number of columns)
<PARAM NAME=border VALUE=60>
(Space all round the chart)
<PARAM NAME=yborder VALUE=18>
(Extra border on the Y-Axis to allow room for the labels)
<PARAM NAME=colmargin VALUE=6>
(Space between the columns)
<PARAM NAME=ymax VALUE=50>
<PARAM NAME=ymin VALUE=0>
(Upper/Lower range of the Y-Axis)
<PARAM NAME=title VALUE="Sales">
(Set the title of the chart)
<PARAM NAME=KEY_1 VALUE="Smith">
<PARAM NAME=KEY_2 VALUE="Jones">
<PARAM NAME=KEY_3 VALUE="Blackthorn">
<PARAM NAME=KEY_4 VALUE="Gupta">
(Values displayed as keys)
<PARAM NAME=LineColor_R_1 VALUE=200>
<PARAM NAME=LineColor_G_1 VALUE=0>
<PARAM NAME=LineColor_B_1 VALUE=0>
<PARAM NAME=LineColor_R_2 VALUE=0>
<PARAM NAME=LineColor_G_2 VALUE=200>
<PARAM NAME=LineColor_B_2 VALUE=0>
<PARAM NAME=LineColor_R_3 VALUE=0>
<PARAM NAME=LineColor_G_3 VALUE=0>
<PARAM NAME=LineColor_B_3 VALUE=200>
<PARAM NAME=LineColor_R_4 VALUE=100>
<PARAM NAME=LineColor_G_4 VALUE=0>
<PARAM NAME=LineColor_B_4 VALUE=100>
(Set a Red, Green and Blue value between 0 and 255 for each bar)
<PARAM NAME=Grid VALUE="true">
(Display the grid? - true or false)
<PARAM NAME=VAL_1_1 VALUE=4>
<PARAM NAME=VAL_1_2 VALUE=3>
<PARAM NAME=VAL_1_3 VALUE=2>
<PARAM NAME=VAL_1_4 VALUE=2>
<PARAM NAME=VAL_2_1 VALUE=25>
<PARAM NAME=VAL_2_2 VALUE=32>
<PARAM NAME=VAL_2_3 VALUE=35>
<PARAM NAME=VAL_2_4 VALUE=2>
<PARAM NAME=VAL_3_1 VALUE=16>
<PARAM NAME=VAL_3_2 VALUE=41>
<PARAM NAME=VAL_3_3 VALUE=15>
<PARAM NAME=VAL_3_4 VALUE=8>
<PARAM NAME=VAL_4_1 VALUE=10>
<PARAM NAME=VAL_4_2 VALUE=2>
<PARAM NAME=VAL_4_3 VALUE=14>
<PARAM NAME=VAL_4_4 VALUE=16>
<PARAM NAME=VAL_5_1 VALUE=10>
<PARAM NAME=VAL_5_2 VALUE=19>
<PARAM NAME=VAL_5_3 VALUE=24>
<PARAM NAME=VAL_5_4 VALUE=12>
(Values to display)
<PARAM NAME=LAB1 VALUE="1Q 2001">
<PARAM NAME=LAB2 VALUE="2Q 2001">
<PARAM NAME=LAB3 VALUE="3Q 2001">
<PARAM NAME=LAB4 VALUE="4Q 2001">
<PARAM NAME=LAB5 VALUE="1Q 2002">
(Labels to display)
</APPLET>

You may want to check out the following script: http://www.javascriptkit.com/script/script2/graphit.shtml










privacy (GDPR)