Blog

All Blog Posts  |  Next Post  |  Previous Post

Interact with your chart data in Delphi

Bookmarks: 

Wednesday, May 4, 2022

Last week we did a blog on visualizing your own data structure, which showed the capabilities of virtual data, and the little code required to get up and running. Today's blog is demonstrating how to interact with the chart. When the data is loaded, how do we zoom in, out? How can we get more details about a specific point in the data?

Panning

Panning is enabled by default, you can pan left to right on the X-Axis. To enable/disable panning, you can use the InteractionOptions.Panning property. Panning is done by moving the finger/mouse from right to left, or left to right. By default, the chart is showing the full range of points, starting at point 1.

TMS Software Delphi  Components

Dragging from left to right will show points before the zero valuepoint on the chart

TMS Software Delphi  Components

Dragging from right to left will show points after the last visible 

TMS Software Delphi  Components

The chart can be reset by using the following code

TMSFNCChart1.BeginUpdate;
for I := 0 to TMSFNCChart1.Series.Count - 1 do
  TMSFNCChart1.Series[I].AutoXRange := arEnabled;
TMSFNCChart1.EndUpdate;

Zooming

Zooming in / out is also enabled by default, on the x-range, which means that you can zoom/scale horizontally. This can be done by holding the CTRL key on the keyboard, dragging the mouse / finger left & right or by doing a pinch gesture on iOS/Android. Below are 2 screenshots of the chart in action whilst zooming in and out

TMS Software Delphi  Components  

TMS Software Delphi  Components

The chart can be reset in the same way as with panning. The property to support scale interaction is located under InteractionOptions.ScaleMode which can be set to smHorizontal (default), smVertical (y-values scaling) or smNone.

Point Detection

The chart exposes a series of events that are triggered when clicking on a point, bar, slice or an item in the legend. For this sample, we want to click on a bar, visualize the value and change the color. The code to do this is shown below.

procedure TForm1.TMSFNCBarChart1SerieBarClick(Sender: TObject;
  APoint: TTMSFNCChartPoint);
begin
  APoint.Color := gcOrange;
  ShowMessage('The point clicked has a value of ' + APoint.YValue.ToString);
end;


TMS Software Delphi  Components

v2.0

Our team is working hard on the next version which will include a significant amount of new features and improvements related to data import, look & feel and out of the box experience. Stay tuned for more! Want to explore the capabilities of TMS FNC Chart, go ahead and download it from our product page.




Pieter Scheldeman


Bookmarks: 

This blog post has received 3 comments.


1. Wednesday, May 4, 2022 at 1:52:29 PM

Please take a lesson from Teechart, zoom x and y by left clicking and drag. Pan by right clicking and dragging. This is very natural. Zooming just the x-axis for my applications (science) is not particularly useful. The idea is to easily zoom in on an AREA of interest. This charting package works very well on a RPi4, and the addition of this natural (to me) area zoom/scroll would wonderful.

Thanks

Dan

Sox Daniel


2. Wednesday, May 4, 2022 at 2:04:24 PM

Thank you for the comment! We are currently working on v2.0 and will investigate the possibilities of more natural interaction experience.

Pieter Scheldeman


3. Thursday, May 5, 2022 at 7:29:34 AM

Is there an example of easily adding functions?
Say
1.Bollinger Bands- that draws on the same axis as the OHLC chart.
2. MACD - that draws on a separate Axis.
Both of the above needs to support adding/changing the last candle in the source series and then have the function "partially" recalc only using the required "lookback" values that impacts the function result.

JP Pienaar




Add a new comment

You will receive a confirmation mail with a link to validate your comment, please use a valid email address.
All fields are required.



All Blog Posts  |  Next Post  |  Previous Post