Page 1 of 1

Self-stacked bar graph with side labels?

Posted: Tue Jan 29, 2013 9:45 am
by 9641609
Hi,

Is it possible to create a self-stacked (single) bar graph with labels off to the side, rather than above each bar. When they're all stacked on top of each other, it makes much more sense to have the label to the side.

I'm trying to generate this graphic, which would ideally have each bar having it's own gradient colour, and a complex label on each side.

Image

If any of the above are possible, please explain how to do it (I'm coding in VB.net). I've tried using the Chart Editor, but couldn't do the above points.

Many thanks,
Phil.

Re: Self-stacked bar graph with side labels?

Posted: Wed Jan 30, 2013 11:13 am
by 10050769
Hello Phil,

I think you can get as you want working with CustomLabels of Axes as I do in next simple code:

Code: Select all

   double TotalSum;
      private void InitializeChart()
      {
          tChart1.Aspect.View3D = false;
          tChart1.Walls.Back.Visible = false;
          tChart1.Axes.Left.Grid.Visible = false;
         Steema.TeeChart.Styles.Bar Series1 = new Steema.TeeChart.Styles.Bar(tChart1.Chart);
         TotalSum = 0;
          for (int i = 0; i < 5; i++)
          {
              Series1.Add(i, i * 100 + 5);
              TotalSum = TotalSum + Series1.YValues[i];

          }
          //InitializeSeries.
          Series1.MultiBar = MultiBars.SelfStack;
          Series1.BarStyle = BarStyles.RectGradient;
          Series1.VertAxis = VerticalAxis.Both;
          Series1.BarWidthPercent = 100;
          Series1.Marks.Visible = false;
          Series1.SideMargins = false;
          //Set CustomLabels:
          SetCustomLabels();

      }

      private void SetCustomLabels()
      {
          double NewPosition = 0;
          Steema.TeeChart.Styles.Bar bar1 = (tChart1[0] as Steema.TeeChart.Styles.Bar);
          for (int i = 0; i < bar1.Count; i++)
          {
              NewPosition = NewPosition + bar1.YValues[i];
              tChart1.Axes.Left.Labels.Items.Add(NewPosition, (Math.Round(bar1.YValues[i] * 100 / TotalSum, 2)).ToString() + "%");
          }
          NewPosition = 0;
          for (int i = 0; i < bar1.Count; i++)
          {
              NewPosition = NewPosition + tChart1[0].YValues[i];
              tChart1.Axes.Right.Labels.Items.Add(NewPosition, (bar1.XValues[i] * 100 / 10).ToString() + "%");
          }
      }
Could you tell us if previous code works in your end?

I hope will helps.

Thanks,

Re: Self-stacked bar graph with side labels?

Posted: Wed Jan 30, 2013 12:47 pm
by 9641609
Great, thanks. I'll try it at the weekend and let you know.
Phil

Re: Self-stacked bar graph with side labels?

Posted: Sun Feb 10, 2013 10:41 pm
by 9641609
Hi Sandra,

The code you sent is working pretty well. The only problem I'm having is that my single set of stacked bars are pinned to the left of the chart space and only one or so pixels wide. Can you please tell me how to get the bars to be the full width of the chart area? i.e from the left axis to the right axis with no margin?

Many thanks.

Phil.

Re: Self-stacked bar graph with side labels?

Posted: Mon Feb 11, 2013 2:59 pm
by 10050769
Hello Phil,

I can not reproduce your problem using next code in last version 4.1.2012.01312:

Code: Select all

       double TotalSum;
        private void InitializeChart()
        {
            tChart1.Aspect.View3D = false;
            tChart1.Walls.Back.Visible = false;
            tChart1.Axes.Left.Grid.Visible = false;
            Steema.TeeChart.Styles.Bar Series1 = new Steema.TeeChart.Styles.Bar(tChart1.Chart);
            TotalSum = 0;
            for (int i = 0; i < 5; i++)
            {
                Series1.Add(i, i * 100 + 5);
                TotalSum = TotalSum + Series1.YValues[i];

            }
            //InitializeSeries.
            Series1.MultiBar = MultiBars.SelfStack;
            Series1.BarStyle = BarStyles.RectGradient;
            Series1.VertAxis = VerticalAxis.Both;
            Series1.BarWidthPercent = 100;
            Series1.Marks.Visible = false;
            Series1.SideMargins = false;
            //Set CustomLabels:
            SetCustomLabels();

        }

        private void SetCustomLabels()
        {
            double NewPosition = 0;
            Steema.TeeChart.Styles.Bar bar1 = (tChart1[0] as Steema.TeeChart.Styles.Bar);
            for (int i = 0; i < bar1.Count; i++)
            {
                NewPosition = NewPosition + bar1.YValues[i];
                tChart1.Axes.Left.Labels.Items.Add(NewPosition, (Math.Round(bar1.YValues[i] * 100 / TotalSum, 2)).ToString() + "%");
            }
            NewPosition = 0;
            for (int i = 0; i < bar1.Count; i++)
            {
                NewPosition = NewPosition + tChart1[0].YValues[i];
                tChart1.Axes.Right.Labels.Items.Add(NewPosition, (bar1.XValues[i] * 100 / 10).ToString() + "%");
            }
        }
The result image I have gotten is next: .
StackBar.jpg
StackBar.jpg (36.15 KiB) Viewed 10116 times
Could you tell us which version of TeeChartFor.Net are you using? If you use the last version and the problem still appears for you, please send us a simple code because, we can reproduce issue here and try to find a solution for you.

Thanks,

Re: Self-stacked bar graph with side labels?

Posted: Mon Feb 11, 2013 3:18 pm
by 9641609
Hi Sandra,

Thanks for your quick response. The details of the TeeChart dll I'm using are...
TeeChart Dll Details.gif
TeeChart Dll Details.gif (26.77 KiB) Viewed 10159 times
I'll try and trim everything back to see if I can reproduce what you've got.

Lastly, is it possible to set the colour of the bars individually?

Many thanks,
Phil.

Re: Self-stacked bar graph with side labels?

Posted: Tue Feb 12, 2013 10:16 am
by 10050769
Hello Phil


Thanks for information. Basically, your problem is that BarWidht property doesn't work in correct way in version 2 and it breaks your application. If you want achieve the same results than latest version TeeChartFor.Net 2012 I recommend use CustomBarWidth property as I do in next code:

Code: Select all

 //Version 2. 
      double TotalSum;
        private void InitializeChart()
        {
            tChart1.Aspect.View3D = false;
            tChart1.Walls.Back.Visible = false;
            tChart1.Axes.Left.Grid.Visible = false;
            Steema.TeeChart.Styles.Bar Series1 = new Steema.TeeChart.Styles.Bar(tChart1.Chart);
            TotalSum = 0;
            for (int i = 0; i < 5; i++)
            {
                Series1.Add(i, i * 100 + 5);
                TotalSum = TotalSum + Series1.YValues[i];

            }
            //InitializeSeries.
            Series1.MultiBar = MultiBars.SelfStack;
            Series1.BarStyle = BarStyles.RectGradient;
            Series1.VertAxis = VerticalAxis.Both;
            Series1.Marks.Visible = false;
            Series1.CustomBarWidth = tChart1.Width;
            SetCustomLabels();

        }

        private void SetCustomLabels()
        {
            double NewPosition = 0;
            Steema.TeeChart.Styles.Bar bar1 = (tChart1[0] as Steema.TeeChart.Styles.Bar);
            for (int i = 0; i < bar1.Count; i++)
            {
                NewPosition = NewPosition + bar1.YValues[i];
                tChart1.Axes.Left.Labels.Items.Add(NewPosition, (Math.Round(bar1.YValues[i] * 100 / TotalSum, 2)).ToString() + "%");
            }
            NewPosition = 0;
            for (int i = 0; i < bar1.Count; i++)
            {
                NewPosition = NewPosition + tChart1[0].YValues[i];
                tChart1.Axes.Right.Labels.Items.Add(NewPosition, (bar1.XValues[i] * 100 / 10).ToString() + "%");
            }
        }

        private void button3_Click(object sender, EventArgs e)
        {
            tChart1.ShowEditor();
        }
Could you tell us if previous code works in your end?
Lastly, is it possible to set the colour of the bars individually?
Yes, is possible. You can assign a color for each bar point. I have added a list of colors in my previous code that allow you assign one color for each bar point:


Code: Select all

 double TotalSum;
        List<Color> colorList;
        private void InitializeChart()
        {
            tChart1.Aspect.View3D = false;
            tChart1.Walls.Back.Visible = false;
            tChart1.Axes.Left.Grid.Visible = false;
            Steema.TeeChart.Styles.Bar Series1 = new Steema.TeeChart.Styles.Bar(tChart1.Chart);
             colorList = new List<Color>(new Color[] { Color.Red, Color.Green, Color.Blue, Color.HotPink, Color.Black});
            TotalSum = 0;
            for (int i = 0; i < 5; i++)
            {
                Series1.Add(i, i * 100 + 5,colorList[i]);
                TotalSum = TotalSum + Series1.YValues[i];

            }
            //InitializeSeries.
            Series1.MultiBar = MultiBars.SelfStack;
            Series1.BarStyle = BarStyles.RectGradient;
            Series1.VertAxis = VerticalAxis.Both;
            Series1.Marks.Visible = false;
            Series1.CustomBarWidth = tChart1.Width;
            SetCustomLabels();

        }

        private void SetCustomLabels()
        {
            double NewPosition = 0;
            Steema.TeeChart.Styles.Bar bar1 = (tChart1[0] as Steema.TeeChart.Styles.Bar);
            for (int i = 0; i < bar1.Count; i++)
            {
                NewPosition = NewPosition + bar1.YValues[i];
                tChart1.Axes.Left.Labels.Items.Add(NewPosition, (Math.Round(bar1.YValues[i] * 100 / TotalSum, 2)).ToString() + "%");
            }
            NewPosition = 0;
            for (int i = 0; i < bar1.Count; i++)
            {
                NewPosition = NewPosition + tChart1[0].YValues[i];
                tChart1.Axes.Right.Labels.Items.Add(NewPosition, (bar1.XValues[i] * 100 / 10).ToString() + "%");
            }
        }

        private void button3_Click(object sender, EventArgs e)
        {
            tChart1.ShowEditor();
        }
Could you tell us if previous code works in your end?

I hope will helps.

Thanks,

Re: Self-stacked bar graph with side labels?

Posted: Mon Feb 18, 2013 12:52 am
by 9641609
Hi Sandra,

All the things that you've suggested have worked. Job done!

Very many thanks,
Phil.