Search code examples
delphiteechart

TCHART with Delphi - cannot have bar show amount and a text description

I have a Delphi Berlin program showing a bar chart, and I want a label above each bar showing the numeric value, and another label below the bar showing a description, like a day of the week. I can get both if I use 2 buttons, showing one or the other, but is there a way to show 2 labels on a bar chart, one above the bar, one below? In this program, button2 shows a label above and an axis below, but it is showing the same info twice for each bar.

I tried to ask this in a previous post, but there was not enough space in a reply to add enough details.

procedure TForm1.Button1Click(Sender: TObject);
var
    i : integer;
begin   
    chart1.series[0].clear;
        for i := 1 to 4  do
             chart1.series[0].add(100+5*i,'',clred);
end;

procedure TForm1.Button2Click(Sender: TObject);
var
    i : integer;
begin
    chart1.series[0].clear;
    day[1] := 'Sun';
    day[2] := 'Mon';
    day[3] := 'Tues';
    day[4] := 'Wed';
    for i := 1 to 4  do
        chart1.series[0].add(100+5*i,day[i],clred);
end;
Solution

  • By default, the series marks is set as smsLabelOrValue and the axis label style is set to talAuto; this will show the point label if present or the point value if no label is present for that point.

    To change that behaviour you can change these properties:

    • Series marks style:

      Chart1.Series[0].Marks.Style:=smsValue;

      Possible values:

      smsValue,             { 1234 }
smsPercent,           { 12 % }
smsLabel,             { Cars } // If label is empty, no mark will be displayed
smsLabelPercent,      { Cars 12 % }
smsLabelValue,        { Cars 1234 }
smsLegend,            { (Legend.Style) }
smsPercentTotal,      { 12 % of 1234 }
smsLabelPercentTotal, { Cars 12 % of 1234 }
smsXValue,            { 1..2..3.. or 21/6/2014 }
smsXY,                { 123 456 }
smsSeriesTitle,       { Series1 }
smsPointIndex,        { 1..2..3... }
smsPercentRelative,   { 100%..90%..120%... }
smsLabelPercentValue, { Cars 12 % 1234 }
smsLabelOrValue

    • Axis label style:

      Chart1.Axes.Bottom.LabelStyle:=talValue; //talAuto, talNone, talValue, talMark, talText, talPointValue

    In your case, adding this to your code in Button2Click gives the desired result:

    Chart1.Series[0].Marks.Style:=smsValue;

    desired result