Vertical Bar Graph Examples

Applet Example 2 - Data from a Text File

if you do not see the graph below then click here

The graph data is acquired from the text file bardata.txt ( click here to view ) and the graph properties are set by the following HTML code,

<applet code="VbarchartApplet.class" archive="Vbarchart.jar" width="450" height="440" mayscript>

<!-- Start Up Parameters -->
<PARAM name="LOADINGMESSAGE" value="Creating Chart - Please Wait.">
<PARAM name="STEXTCOLOR" value="0,0,100">
<PARAM name="STARTUPCOLOR" value="255,255,255">

<!-- Character Encoding -->
<PARAM name="charset" value="8859_1">

<!-- Data files -->
<PARAM name="chartdata" value="bardata.txt">

<!-- Chart Switches -->
<PARAM name="3D" value="true">
<PARAM name="grid" value="true">
<PARAM name="axis" value="true">
<PARAM name="ylabels" value="true">
<PARAM name="outline" value="true">
<PARAM name="legend" value="true">
<PARAM name="autoscale" value="false">
<PARAM name="gradientfill" value="true">

<!-- Chart Characteristics -->
<PARAM name="nCols" value="4">
<PARAM name="nRows" value="6">
<PARAM name="ndecplaces" value="0">
<PARAM name="nSeries" value="3">
<PARAM name="chartScale" value="10000">
<PARAM name="chartStartY" value="0">
<PARAM name="labelOrientation" value="0">
<PARAM name="labelsY" value="390">
<PARAM name="labelsY_offset" value="15">
<PARAM name="bar_spacing" value="10">
<PARAM name="barwidth" value="20">
<PARAM name="depth3D" value="15">
<PARAM name="linkcursor" value="hand">
<PARAM name="BackgroundColor" value="White">
<PARAM name="barOutlineColor" value="black">

<!-- Grid properties -->
<PARAM name="gridxpos" value="70">
<PARAM name="gridypos" value="375">
<PARAM name="vSpace" value="30">
<PARAM name="gridStyle" value="2">
<PARAM name="gridColor" value="50,50,50">
<PARAM name="axisColor" value="0,0,255">
<PARAM name="floorColor" value="50,50,50">
<PARAM name="gridbgcolor" value="#EEEEFF">
<PARAM name="gridbgimage" value=" ">

<!-- Label and pop-up value properties -->
<PARAM name="xlabel_font" value="Arial,N,12">
<PARAM name="ylabel_font" value="Arial,I,10">
<PARAM name="popupfont" value="Arial,N,10">
<PARAM name="labelColor" value="75,75,125">
<PARAM name="popupbgcolor" value="255,255,200">
<PARAM name="popup_pre" value="$">
<PARAM name="popup_post" value=" ">
<PARAM name="ylabel_pre" value="$">
<PARAM name="ylabel_post" value=" ">
<PARAM name="thousandseparator" value=",">

<!-- Bar Labels -->
<PARAM name="label1" value="Quarter 1">
<PARAM name="label2" value="Quarter 2">
<PARAM name="label3" value="Quarter 3">
<PARAM name="label4" value="Quarter 4">

<!-- Legend Information -->
<PARAM name="legendfont" value="Arial,N,10">
<PARAM name="legendposition" value="285,50">
<PARAM name="legendtitle" value="Product Range">
<PARAM name="LegendBackground" value="240,240,240">
<PARAM name="LegendBorder" value="125,125,125">
<PARAM name="LegendtextColor" value="50,50,50">

<!-- Titles - Main, x and y -->
<!-- text|xpos,ypos|Font|Color -->
<PARAM name="title" value="Sales by Quarter|50,25|Arial,BI,18|130,130,180">
<PARAM name="xtitle" value="Quarter|200,435|Arial,B,16|130,130,180">
<PARAM name="ytitle" value="Sales Value|5,200|Arial,B,16|130,130,180">

<!-- Series Data -->
<!-- series color|2nd scale|legend label|Link URL|Target Frame -->
<PARAM name="series1" value="199,199,199|left|Product X|./images/productX.gif|X">
<PARAM name="series2" value="200,100,100|left|Product Y|./images/productY.gif|Y">
<PARAM name="series3" value="100,100,200|left|Product Z|./images/productZ.gif|Z">

<!-- Target Lines -->
<!-- Color|style|value|label|font -->
<!-- <PARAM name="target1" value="#990000|4|28000|Break Even|Arial,N,10"> -->
<!-- <PARAM name="target2" value="#007700|1|55000|Target|Arial,N,10"> -->

<!-- Free Form Text -->
<!-- text|xpos,ypos|Font|Color -->
<PARAM name="text1" value="Note :|125,60|Arial,N,12|0,0,175">
<PARAM name="text2" value="New product range|125,75|Arial,N,12|50,50,50">
<PARAM name="text3" value="launched during|125,90|Arial,N,12|50,50,50">
<PARAM name="text4" value="quarter 2.|125,105|Arial,N,12|50,50,50">

<!-- Images -->
<!-- Image URL, x, y -->
<PARAM name="image1" value="./images/productY.gif,375,85">
<PARAM name="image2" value="./images/productX.gif,375,110">
<PARAM name="image3" value="./images/productZ.gif,375,135">

</applet>

For a full explanation of and range of values for the above parameters please see the Documentation - Configuration Options».

« back to Examples Index

« back to Getting Started