|
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="SHbarchartApplet.class" archive="SHbarchart.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">
<!-- Chart Switches -->
<PARAM name="3D" value="true">
<PARAM name="grid" value="true">
<PARAM name="axis" value="true">
<PARAM name="xlabels" 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="12">
<PARAM name="nRows" value="6">
<PARAM name="ndecplaces" value="0">
<PARAM name="nSeries" value="3">
<PARAM name="chartScale" value="10000">
<PARAM name="chartStartX" value="0">
<PARAM name="labelOrientation" value="0">
<PARAM name="labelsX" value="45">
<PARAM name="labelsX_offset" value="15">
<PARAM name="bar_spacing" value="6">
<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="100">
<PARAM name="gridypos" value="375">
<PARAM name="hSpace" 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="xlabel_pre" value="$">
<PARAM name="xlabel_post" value=" ">
<!-- Bar Labels -->
<PARAM name="label1" value="January">
<PARAM name="label2" value="February">
<PARAM name="label3" value="March">
<PARAM name="label4" value="April">
<PARAM name="label5" value="May ">
<PARAM name="label6" value="June ">
<PARAM name="label7" value="July ">
<PARAM name="label8" value="August ">
<PARAM name="label9" value="September">
<PARAM name="label10" value="October ">
<PARAM name="label11" value="November ">
<PARAM name="label12" value="December ">
<!-- Legend Information -->
<PARAM name="legendfont" value="Arial,N,10">
<PARAM name="legendposition" value="325,60">
<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 Month|50,25|Arial,BI,18|130,130,180">
<PARAM name="xtitle" value="Sales Value|150,435|Arial,B,16|130,130,180">
<PARAM name="ytitle" value="Month|15,150|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 :|325,200|Arial,N,12|0,0,175">
<PARAM name="text2" value="New product range|325,215|Arial,N,12|50,50,50">
<PARAM name="text3" value="launched during|325,230|Arial,N,12|50,50,50">
<PARAM name="text4" value="quarter 2.|325,245|Arial,N,12|50,50,50">
<!-- Images -->
<!-- Image URL, x, y -->
<PARAM name="image1" value="./images/productY.gif,415,95">
<PARAM name="image2" value="./images/productX.gif,415,120">
<PARAM name="image3" value="./images/productZ.gif,415,145">
<!-- Bar Data -->
<!-- value,URL,Target Frame -->
<PARAM name="data1series1" value="17000">
<PARAM name="data2series1" value="17900">
<PARAM name="data3series1" value="26000">
<PARAM name="data4series1" value="13600">
<PARAM name="data5series1" value="17000">
<PARAM name="data6series1" value="17900">
<PARAM name="data7series1" value="26000">
<PARAM name="data8series1" value="13600">
<PARAM name="data9series1" value="17000">
<PARAM name="data10series1" value="17900">
<PARAM name="data11series1" value="26000">
<PARAM name="data12series1" value="13600">
<PARAM name="data1series2" value="7000">
<PARAM name="data2series2" value="7900">
<PARAM name="data3series2" value="6000">
<PARAM name="data4series2" value="8600">
<PARAM name="data5series2" value="7000">
<PARAM name="data6series2" value="7900">
<PARAM name="data7series2" value="6000">
<PARAM name="data8series2" value="3600">
<PARAM name="data9series2" value="2000">
<PARAM name="data5series3" value="7400">
<PARAM name="data6series3" value="17100">
<PARAM name="data7series3" value="26900">
<PARAM name="data8series3" value="23650">
<PARAM name="data9series3" value="27300">
<PARAM name="data10series3" value="27300">
<PARAM name="data11series3" value="26500">
<PARAM name="data12series3" value="23700">
</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
|
[
