PHPTutorial1

From Steema Software Reference Wiki
Revision as of 11:46, 29 April 2016 by Clive (Talk | contribs) (Selecting a Series Type to suit your data needs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Tchart php.png

Contents page
Next

Tutorial 1 - Getting started


Getting Started - building Charts and populating Data Series

You may define the Chart appearance, titles, Legend characteristics and 3D aspect without having to include a data Series.
That gives you the freedom to add and remove different data Series types at runtime without having to redefine the whole Chart look and feel.

Pieces.png

Everything comes together to make the final Chart, with Chart axes being the interface between Chart and Series.
A Series has data, and its values will influence the label characteristics of the Chart axes.
The axes appearance, colours, grid frequency and label fonts may all be defined for the Chart before adding data Series.
TeeChart will make a best estimate of most values to minimise the need for you to manually define Chart and Series methods.


The steps in this tutorial highlight how easy it is to build a Chart from scratch and will introduce you through later tutorials, to modify and further enhance the appearance and functionality of the Chart at runtime. Good Charting !!

Building a Chart

Including TeeChart on a PHP web page

To include a Tchart component on a PHP web page is easy. You only have to add the path where the TeeChart for PHP library has been installed on the server as an include :

<?php 
include "../sources/libTeeChart.php";
?>

This will allow you to interact with the TeeChart for PHP classes. The TChart and render it use the following code :

<?php 
$tchart = new TChart(500,300);��� // specifying its size (width , height)
$tchart->render("tchart.png");
?>

Now, some html lines are required to display the image at the same page :

<body> 
<img alt="" src="tchart.png" style="border: 0px solid gray;"/>
</body>

Including TeeChart on a Delphi for PHP Form

If you want to use the TeeChart for PHP library under the "Delphi for PHP" IDE the following steps must be taken :

1) Copy the \teechart folder into the \vcl folder of "Delphi for PHP" installation, creating the following folders :

\Delphi for PHP\vcl\teechart
\Delphi for PHP\vcl\teechart\sources
\Delphi for PHP\vcl\teechart\demos\*,*
\Delphi for PHP\vcl\teechart\docs\*,*

2) Copy the \teechart\sources\tchart.inc.php and \teechart\sources\tchart.ide.inc.php files into the \vcl folder of "Delphi for PHP".

3) Open the "Delphi for PHP" IDE, go to "Component -> Packages" menu option, click "Add" and look for the "\teechart\sources\TeeChart.package.php" file. This will add the "TeeChart for PHP Components" item into the list of installed packages. Now click OK.

4) If you create a new Delphi for PHP project and go to the design page a new "TeeChart" tab should appear on the Tool Palette. You will find the TChartOBj component there. You should be able to select it and place it on the Form as for any other component.

Button1.gif

Select the TChartObj icon, click and drag out to size TChartObj on a PHP Form.
You will see TChartObj as a panel with some basic Chart features such as Axis and Title.

Populate the new data Series

For programmed input of data you will need to write some code. This section will show you the steps necessary to build a chart with coded input.

At runtime the Series will be empty of data unless you manually populate it. Here an example of code to populate them :

$tChart1 = new TChart(500,300);
$bar = new Bar($tChart1->getChart()); 
$tChart1->getAxes()->getBottom()->setIncrement(1);
$bar->addYTextColor(400, "pears", Color::GREEN());
$bar->addYTextColor(500, "apples", Color::RED());
$bar->addYTextColor(400, "bananas", Color::YELLOW());
$bar->addYTextColor(200, "oranges", Color::ORANGE());


Run the project and new bars will appear on your Chart. That's it !! There's no more to it.

SeriesDemo.png


Please take a look at the Documentation about Series 'Add' methods, in this case we have used the addXYTextColor(XValue,YValue,Text,Color) but there're more availables as :

$bar->addXY(XValue,YValue) 
$bar->addXYText(XValue,YValue,Text)
$bar->addXYColor(XValue,YValue,Color)
$bar->addYText(YValue,Text)
$bar->addYTextColor(YValue,Text,Color)
$bar->addYColor(Value,Color)
$bar->addText(Text)
$bar->add()
$bar->addNull()
$bar->addNullXY(XValue,YValue)


The add() method thus assumes equal spacing of values on the Label axis (in this case the X-Axis). If your data contains 2 variables you may use the AddXY Method. Run the Project and add points using this code:

require_once "../sources/TChart.php" 
$tChart1 = new TChart(500,300);


Here we've used addYTextColor to allow us to specify the Text and Color but, if these aren't required you can make use of the add(YValue) method directly.

Selecting a Series Type to suit your data needs

The last coded example generated new X and Y values. The X axis distance between points may not be constant, depending on the values used, which may cause overlapping of Bars in some cases. This would be desirable for some but not all applications. You can use the ChangeSeriesType() method to change the type of a specific Series. The new Series type must graphically represent data with the same number of variables. If your data contains different number of variables of the new type an error will appear. The following table shows the composition of TeeChart Series types.


Series Type

No. of variables

Datasource Properties

Standard types

Line

2

XValues, YValues, XLabel

Horizontal Line

2

XValues, YValues, XLabel

Fast Line

2

XValues, YValues, XLabel

Bar

2

XValues, YValues (called Bar), XLabel

HorizBar

2

XValues, YValues (called Bar), XLabel

Area

2

XValues, YValues, XLabel

HorizArea

2

XValues, YValues, XLabel

Point

2

Xvalues, YValues, XLabel

Pie

1

PieValues, XLabel

Arrow

4

StartXValues, StartYValues, XLabel, EndXValues, EndYValues

Bubble

3

Xvalues, YValues, XLabel, RadiusValues

Gantt

3

StartValues, EndValues, AY (Y axis level), AXLabel (Label optionally shown on Y-axis or as mark)

Shape

4

X0 (Top), Y0 (Bottom), X1 (Left), Y1 (Right)

Subset of Extended Types

Bezier

2

XValues, YValues, XLabel

Candle

5

OpenValues, CloseValues, HighValues, LowValues, DateValues

Contour

3

XValues, YValues, XLabel, ZValues

Error Bar

3

XValues, YValues, XLabel, ErrorValues

Point3D

3

XValues, YValues, XLabel, ZValues

Polar

2

XValues, YValues, Labels (Polar has Angle and Radius)

Radar

2

XValues, YValues, Labels (Radar has Angle and Radius)

3D Surface

3

XValues, YValues, ZValues

Volume

2

XValues, YValues (VolumeValues), XLabel



NEXT

© 1998-2019 Steema Software SL. All rights reserved.