2

Am creating an windows form application which uses chart.I want to modify the chart

  1. How to edit the chart area back ground color (white color in in screen shot)
  2. How to apply different color to each bar.
  3. How to format the Y axis label(need to align the file extension to left end and integer value to right end)

This is my current screen shot

enter image description here

Need to update my screen like this

enter image description here

Is it possible to align label like this

enter image description here

thejustv
  • 2,009
  • 26
  • 42

1 Answers1

4

Here is an example:

enter image description here

To style the Chart you use this:

// prepare:
chart1.Series.Clear();
Series S1 = chart1.Series.Add("S1");
ChartArea CA = chart1.ChartAreas[0];

// style type, font, color, axes
S1.ChartType = SeriesChartType.Bar;
CA.BackColor = Color.AliceBlue;
chart1.BackColor = CA.BackColor;
Font f = new Font("Consolas", 10f);
CA.AxisX.LabelStyle.Font = f;

S1.BackGradientStyle = GradientStyle.TopBottom;
CA.AxisX.MajorGrid.Enabled = false;
CA.AxisX.MajorTickMark.Enabled = false;
CA.AxisX.LineColor = Color.Transparent;

CA.AxisY.Enabled = AxisEnabled.False;
CA.AxisY.MajorGrid.Enabled = false;
CA.AxisY.MajorTickMark.Enabled = false;

To color individual DataPoints you must set their Color:

S1.Points[0].Color = Color.YellowGreen;
S1.Points[1].Color = Color.YellowGreen;

To create the formatted labels you can create the strings and use them as (pseudo) X-Values when adding the points:

string label = string.Format("{0,-11}{1, 7:0.0}%{2,8:##0.0}GB  ",
                t.Item1, t.Item2 * 100d / total, t.Item2) + "\u2001\u2001";
int idx = S1.Points.AddXY(label, t.Item2);

Here I use a Tuple<string, int> to hold my data. You will need to adapt this to your data source. Note how I calculate the percentage from a total.

Here is the full code I used for my example data:

List<Tuple<string, double>> data = new List<Tuple<string, double>>()
{
    new Tuple<string, double>( "0-1 months", 4 ),
    new Tuple<string, double>( "2-3 months", 14 ),
    new Tuple<string, double>( "4-11 months", 44 ),
    new Tuple<string, double>( "1-2 years", 23 ),
    new Tuple<string, double>( "3-5 years", 3 ),
    new Tuple<string, double>( "> 5 years", 100 ),

};

double total = data.Sum(x => x.Item2);

foreach (Tuple<string, double> t in data)
{
    string label = string.Format("{0,-11}{1, 7:0.0}%{2,8:##0.0}GB",
                   t.Item1, t.Item2 * 100d / total, t.Item2) + "\u2001\u2001";
    int i = S1.Points.AddXY(label, t.Item2);
    S1.Points[i].Font = f;
}

Notes:

  • To get internal string alignment you need to use a monospaced font like Consolas.
  • Also note that you can't use different fonts or styles inside one label.
  • I add two m-space characters to create a distance between labels and the plotarea. (Normal spaces would not display!).

Update:

The second chart image shows a SeriesChartType.Column. To insert new lines all you need to do is insert a \n character and make sure there is enough room.

The tricky part is have one line in a different color. This is not possible with Labels.

Instead you need to add two CustomLabels per datapoint: The fist one shows the e.g. black lines. The second one can have a different ForeColor and need to have as many \n at the beginning as the first one has lines.

Note that CustomLabels sit in the middle between two positions. So I have now added the DataPoints with real numbers, starting with 0, as their X-Values and then position the CustomLabels halfway between..

enter image description here

    chart1.Series.Clear();
    Series S1 = chart1.Series.Add("S1");
    S1.ChartType = SeriesChartType.Column;
    ChartArea CA = chart1.ChartAreas[0];
    chart1.Legends.Clear();

    CA.BackColor = Color.AliceBlue;
    chart1.BackColor = Color.AliceBlue;
    Font f = new Font("Consolas", 9f);

    CA.AxisX.LabelStyle.Font = f;

    S1.BackGradientStyle = GradientStyle.LeftRight;
    CA.AxisX.MajorGrid.Enabled = false;
    CA.AxisX.MajorTickMark.Enabled = false;
    CA.AxisX.LineColor = Color.Transparent;

    CA.AxisY.Enabled = AxisEnabled.False;
    CA.AxisY.MajorGrid.Enabled = false;
    CA.AxisY.MajorTickMark.Enabled = false;

    CA.Position.X = 0f;

    List<Tuple<string, double>> data = new List<Tuple<string, double>>()
    {
        new Tuple<string, double>( "0-1 months", 4 ),
        new Tuple<string, double>( "2-3 months", 14 ),
        new Tuple<string, double>( "4-11 months", 44 ),
        new Tuple<string, double>( "1-2 years", 23 ),
        new Tuple<string, double>( "3-5 years", 3 ),
        new Tuple<string, double>( "> 5 years", 100 ),

    };

    double total = data.Sum(x => x.Item2);

    foreach (Tuple<string, double> t in data)
    {
        string label1 = string.Format("{0}\n{1:0.0}%", t.Item1, t.Item2 * 100d / total);
        string label2 = string.Format("\n\n{0:##0.0}GB", t.Item2);
        int i = S1.Points.AddXY(S1.Points.Count, t.Item2);
        S1.Points[i].Font = f;

        DataPoint dp = S1.Points[i];
        int v = (int)dp.YValues[0];
        CustomLabel cl = new CustomLabel();
        cl.Text = label1;
        cl.FromPosition = i - 0.5f;
        cl.ToPosition = i + 0.5f;

        CustomLabel cl2 = new CustomLabel();
        cl2.Text = label2;
        cl2.FromPosition = i -0.5f;
        cl2.ToPosition = i + 0.5f;

        cl2.ForeColor = Color.Green;
        CA.AxisX.CustomLabels.Add(cl);
        CA.AxisX.CustomLabels.Add(cl2);

    }
    S1.Points[0].Color = Color.YellowGreen;
    S1.Points[1].Color = Color.YellowGreen;
TaW
  • 53,122
  • 8
  • 69
  • 111