Skip to main content
Get started with TeeChart VCL/FMX samples and create your first chart in minutes.

​
Prerequisites

Before you begin, ensure you have:

TeeChart Pro VCL/FMX

Download the fully functional evaluation version from Steema Downloads

RAD Studio/Delphi/C++ Builder

Any recent version of RAD Studio, Delphi, or C++ Builder (see Requirements)
TeeChart Pro VCL/FMX evaluation includes all features and is required to run the samples in this repository.

​
Installation steps

1

Download TeeChart Pro

Visit https://www.steema.com/downloads/vcl and download the TeeChart Pro VCL/FMX evaluation installer for your version of RAD Studio, Delphi, or C++ Builder.Run the installer and follow the prompts to install TeeChart Pro into your IDE.
The evaluation version is fully functional with no feature limitations. It includes all chart types, tools, and export formats.
2

Clone the samples repository

Clone this repository to access 700+ working examples:
git clone https://github.com/Steema/TeeChart-VCL-FMX-Samples.git
cd TeeChart-VCL-FMX-Samples
Alternatively, download the repository as a ZIP file from GitHub and extract it to your preferred location.
3

Open your first sample

Choose a framework and open a demo project:
Option 1: TeeNew Demo (Recommended)Open VCL/TeeNew/TeeNew.dproj for the comprehensive demo with 687 examples showcasing every TeeChart feature.Option 2: Specific Feature SamplesBrowse the VCL/ directory for specific samples:
  • VCL/ActivityGauge/ - Gauge components
  • VCL/Map_Layers/ - Geographic maps
  • VCL/Animations/ - Chart animations
  • VCL/TeeMaker/ - 3D object creation tool
4

Build and run

  1. Open the project file (.dproj) in your IDE
  2. Press F9 or click Run to compile and run the sample
  3. Explore the features and interact with the charts
  4. View the source code to understand how each feature is implemented
Start with the TeeNew demo (VCL) or the main FMX demo to see an overview of all chart types and features in one application. Use the navigation tree to browse examples by category.

​
Create your first chart

Once you’ve explored the samples, try creating your own chart from scratch.

​
Creating a simple bar chart

uses
  VCLTee.TeEngine, VCLTee.Series, VCLTee.TeeProcs, VCLTee.Chart;

procedure TForm1.FormCreate(Sender: TObject);
var
  BarSeries: TBarSeries;
begin
  // Create the chart
  Chart1 := TChart.Create(Self);
  Chart1.Parent := Self;
  Chart1.Align := alClient;
  
  // Add a bar series
  BarSeries := TBarSeries.Create(Chart1);
  Chart1.AddSeries(BarSeries);
  
  // Add data
  BarSeries.Add(10, 'Product A', clRed);
  BarSeries.Add(25, 'Product B', clGreen);
  BarSeries.Add(15, 'Product C', clBlue);
  BarSeries.Add(30, 'Product D', clYellow);
  
  // Customize appearance
  Chart1.Title.Text.Text := 'Sales by Product';
  Chart1.Legend.Visible := True;
  Chart1.View3D := False;
end;

​
Adding real-time data

For streaming data visualization, use TFastLineSeries: 
uses
  VCLTee.TeEngine, VCLTee.Series, VCLTee.TeeProcs, VCLTee.Chart;

var
  FastLine: TFastLineSeries;
  Timer: TTimer;
  X: Integer = 0;

procedure TForm1.FormCreate(Sender: TObject);
begin
  FastLine := TFastLineSeries.Create(Chart1);
  Chart1.AddSeries(FastLine);
  
  // Optimize for real-time performance
  FastLine.DrawAllPoints := False;
  FastLine.LinePen.Width := 2;
  Chart1.AutoRepaint := False;
  
  // Setup timer for updates
  Timer := TTimer.Create(Self);
  Timer.Interval := 50;  // 20 FPS
  Timer.OnTimer := UpdateChart;
  Timer.Enabled := True;
end;

procedure TForm1.UpdateChart(Sender: TObject);
begin
  FastLine.AddXY(X, Sin(X * 0.1) + Random);
  Inc(X);
  
  // Keep only last 100 points
  if FastLine.Count > 100 then
    FastLine.Delete(0);
  
  Chart1.Repaint;
end;

​
Connecting to a database

Bind a chart directly to a dataset: 
uses
  VCLTee.TeEngine, VCLTee.Series, VCLTee.DBChart, Data.DB;

procedure TForm1.FormCreate(Sender: TObject);
var
  BarSeries: TBarSeries;
begin
  // Create DB-aware chart
  DBChart1 := TDBChart.Create(Self);
  DBChart1.Parent := Self;
  DBChart1.Align := alClient;
  
  // Add series and bind to dataset
  BarSeries := TBarSeries.Create(DBChart1);
  DBChart1.AddSeries(BarSeries);
  
  // Connect to dataset fields
  BarSeries.DataSource := ClientDataSet1;
  BarSeries.XLabelsSource := 'ProductName';
  BarSeries.YValues.ValueSource := 'Sales';
  
  // Aggregate data
  BarSeries.GroupBy := gbSum;
  
  DBChart1.Title.Text.Text := 'Sales by Product';
end;

​
Next steps

Explore VCL samples

Browse 687 VCL examples including financial charts, gauges, maps, and 3D visualizations

Explore FMX samples

Check out cross-platform FireMonkey examples for Windows, macOS, iOS, and Android

Chart types

Learn about all 70+ available chart types and when to use each one

Advanced features

Discover axes, legends, annotations, export, real-time data, and database integration
Start with these essential samples:

​
For VCL development

  1. TeeNew Demo (VCL/TeeNew/TeeNew.dproj)
    • 687 comprehensive examples
    • Every chart type and feature
    • Interactive navigation tree
    • Source code for every example
  2. TeeChartOffice (VCL/TeeChartOffice/)
    • Professional business dashboard
    • Multiple synchronized charts
    • Real-world data visualization patterns
  3. Map_Layers (VCL/Map_Layers/)
    • Geographic visualization
    • Shapefile support
    • Interactive maps with zooming

​
For FireMonkey development

  1. Main FMX Demo (FMX/Demo/TeeChart_Pro_Firemonkey_Demo.dproj)
    • Cross-platform examples
    • Touch-friendly interactions
    • Mobile-optimized layouts
  2. Dashboard (FMX/Dashboard/LinkingCharts.dpr)
    • Multi-chart dashboard
    • Synchronized charts
    • Database integration
  3. StandardSeriesDemo (FMX/StandardSeriesDemo/)
    • All standard chart types
    • Platform-specific examples
    • Animation effects

​
Common customizations

Here are some common customization code snippets:

​
Customize axes

// Set axis range
Chart1.LeftAxis.SetMinMax(0, 100);

// Format axis labels
Chart1.BottomAxis.LabelStyle := talValue;
Chart1.LeftAxis.LabelsFormat.Font.Size := 10;

// Add grid lines
Chart1.LeftAxis.Grid.Visible := True;
Chart1.LeftAxis.MinorGrid.Visible := True;

​
Customize legend

// Position legend
Chart1.Legend.Alignment := laBottom;
Chart1.Legend.LegendStyle := lsSeries;

// Customize appearance
Chart1.Legend.Shadow.Visible := True;
Chart1.Legend.Font.Size := 12;
Chart1.Legend.Symbol.Width := 20;

​
Enable zooming and panning

uses VCLTee.TeeTools;

var
  ZoomTool: TChartTool;
  PanTool: TPanningTool;

begin
  // Add zoom tool
  ZoomTool := TZoomTool.Create(Chart1);
  Chart1.Tools.Add(ZoomTool);
  
  // Add pan tool
  PanTool := TPanningTool.Create(Chart1);
  Chart1.Tools.Add(PanTool);
end;

​
Export chart to PDF

uses VCLTee.TeeExport, VCLTee.TeePDFCanvas;

procedure TForm1.ExportToPDF(const FileName: string);
var
  PDFExport: TPDFExportFormat;
begin
  PDFExport := TPDFExportFormat.Create;
  try
    PDFExport.Panel := Chart1;
    PDFExport.SaveToFile(FileName);
  finally
    PDFExport.Free;
  end;
end;

​
IDE compatibility

The samples support multiple IDE versions:
  • RAD Studio XE2 through RAD Studio 12.2 Athens
  • Delphi XE2 through Delphi 12.2
  • C++ Builder XE2 through C++ Builder 12.2
Project files are version-specific (e.g., .dproj for Delphi). Some samples may have multiple project files for different IDE versions.

​
Getting help

Support options

Get help from Steema’s support team

Documentation

Browse the complete TeeChart documentation

Forum

Ask questions in the community forum

GitHub

Report issues or contribute examples

Build docs developers (and LLMs) love

Get started for freeTalk to us