Steema Central

Posted: **Sun Mar 30, 2008 7:24 pm**

Hi

I would like to emulate the graphs that Google generate using Flex on their Financial pages.

http://finance.google.co.uk/finance?q=LON:HBOS

The effect that I would like to reproduce is the 'blue' spot that follows the curve of the graph as the mouse pointer is moved across the x axis. I have used the 'color-line' tool before to place a line from the top to the bottom of the Y axis to do a very similar thing, but this obviously won't work here and will require some highlighting of the currently selected point.

Any help would be appreciated - I do believe this would be a useful feature to add to TeeChart anyway.

I can't believe that Flex have something we don't have!

Bruce.

Posted: **Mon Mar 31, 2008 10:17 am**

Hi Bruce,

Don't panic! It's possible to do the same with teechart.
I've modified the example that Narcis made here and I think that the following code achieves what you suggested:

Code: Select all

var
  xval: Double;  // global variable

function TForm1.InterpolateLineSeries(Series: TChartSeries; FirstIndex,
                                   LastIndex: Integer; XValue: Double): Double;
var
  Index: Integer;
  dx,dy: Double;
begin
  for Index:=FirstIndex to LastIndex do
    if Series.XValues.Value[Index]>XValue then break;

  //safeguard
  if (Index<1) then Index:=1
  else if (Index>=Series.Count) then Index:=Series.Count-1;

  // y=(y2-y1)/(x2-x1)*(x-x1)+y1
  dx:=Series.XValues.Value[Index] - Series.XValues.Value[Index-1];
  dy:=Series.YValues.Value[Index] - Series.YValues.Value[Index-1];

  if (dx<>0) then
    result:=dy*(XValue - Series.XValues.Value[Index-1])/dx + Series.YValues.Value[Index-1]
  else result:=0;
end;

function TForm1.InterpolateLineSeries(Series: TChartSeries;XValue: Double): Double;
begin
  result:=InterpolateLineSeries(Series,Series.FirstDisplayedIndex,Series.LastValueIndex,XValue);
end;


procedure TForm1.ChartTool1Change(Sender: TCursorTool; x, y: Integer;
  const XValue, YValue: Double; Series: TChartSeries; ValueIndex: Integer);
var
  i: Integer;
begin
  xval := XValue;

  With Chart1.Title.Text do
  begin
    Clear;
    for i:=0 to Chart1.SeriesCount - 1 do
        Add(Chart1[i].Name + ': Y('+FloatToStr(XValue)+')= ' +
            FloatToStr(InterpolateLineSeries(Chart1[i],XValue))+#13#10);
  end;
end;

procedure TForm1.Chart1AfterDraw(Sender: TObject);
var xs, ys, i: Integer;
begin
  xs := Chart1.Axes.Bottom.CalcXPosValue(xval);

  for i:=0 to Chart1.SeriesCount - 1 do
  begin
    ys := Chart1[i].GetVertAxis.CalcYPosValue(InterpolateLineSeries(Chart1[i],xval));
    Chart1.Canvas.Brush.Color := Chart1[i].Color;
    Chart1.Canvas.Ellipse(xs-4,ys-4,xs+4,ys+4);
  end;
end;

Posted: **Mon Mar 31, 2008 7:19 pm**

Hi Yeray

Thanks for the quick response and it works well when you hook the code up to the cursor tool.

Bruce.

Steema Central

Google finance graph

Google finance graph