|
Probably the simplest implementation, this example demonstrates setting up
the graph in a web page so that both the configuration and graph data are read from the <PARAM> tags within the HTML page.
and here is the HTML code,
<applet code="SVbarchartApplet.class" archive="SVbarchart.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">
<!-- 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="20000">
<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="25">
<PARAM name="barwidth" value="40">
<PARAM name="depth3D" value="20">
<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|legend label|Link URL|Target Frame -->
<PARAM name="series1" value="199,199,199|Product X|./images/productX.gif|X">
<PARAM name="series2" value="200,100,100|Product Y|./images/productY.gif|Y">
<PARAM name="series3" value="100,100,200|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">
<!-- Bar Data -->
<!-- value,URL,Target Frame -->
<PARAM name="data1series1" value="34000,./images/productX.gif,_self">
<PARAM name="data2series1" value="34900,./images/productX.gif,_self">
<PARAM name="data3series1" value="52000">
<PARAM name="data4series1" value="27600">
<PARAM name="data1series2" value="14000,./images/productY.gif,_self">
<PARAM name="data2series2" value="14900,./images/productY.gif,_self">
<PARAM name="data3series2" value="12000,./images/productY.gif,_self">
<PARAM name="data4series2" value="16600,./images/productY.gif,_self">
<PARAM name="data2series3" value="34100,./images/productZ.gif,_self">
<PARAM name="data3series3" value="52900,./images/productZ.gif,_self">
<PARAM name="data4series3" value="56650,./images/productZ.gif,_self">
</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
|
[
