Monday, November 5, 2012

Horizontal ScrollBar in 3d Bar chart (MS Chart Control) C#


Hi,

     While implementing 3d MS Chart (Microsoft chart control) in my .net project, i’ve  found out that 3d bar chart does not comes with Horizontal scroll bar implementation. When you have more number of datapoints in the chart you will be in trouble. Though the chart control has the property for the HScrollbar, it is not working on 3d charts. After a small effort, I found a simple solution for the implementation of HScrollBar.

     Drag the Chart Control from the toolbox and add it to a panel, Drag HScrollBar control from toolbox and add it to the bottom of the panel.

      Here i have created  a method called LoadGrid() to load data to the chart control. I'm using Datatable to load the datas for chart control. Name, Amount are the columns in my datatable. Here Name will be in XAxis and Amount will be in YAxis. hscroll_chart is HScrollBar controls variable.

public void LoadGrid(DataTable myDataTable)
{
      foreach (DataRow row in myDataTable.Rows)
                    {
                        chart1.Series["Channel 1"].Points.AddXY(row["Name"], row["Amount"]);
                    }
          chart1.DataManipulator.GroupByAxisLabel(“Sum” "Channel 1");


          chart1.Series["Channel 1"].ChartType = SeriesChartType.Column;
          chart1.ChartAreas["Default"].Area3DStyle.Enable3D = true;

                   var chartArea = chart1.ChartAreas[0];
                   chartArea.AxisX.Minimum = 0;
                    chartArea.AxisX.Maximum = chart1.Series[0].Points.Count;

                   chartArea.AxisX.ScaleView.Zoomable = true;
                   chartArea.AxisX.ScaleView.SizeType = DateTimeIntervalType.Number;

                   int position = 0;
                   int size = 20;
                   chartArea.AxisX.ScaleView.Zoom(position, size);

                   chartArea.AxisX.Interval = 1;
                   chartArea.AxisY.IntervalAutoMode = IntervalAutoMode.VariableCount;

                     hscroll_chart.Value = 0;
                     hscroll_chart.Minimum = 0;
                     int ScalePoints = chart1.Series[0].Points.Count / 20;
                     hscroll_chart.Maximum = ScalePoints;
}

Then add the following in the HScrollBar Scroll event,

private void hscroll_chart_Scroll(object sender, ScrollEventArgs e)
        {
            var chartArea = chart1.ChartAreas[0];
            int val = (hscroll_chart.Value * 20);
            if (((hscroll_chart.Value * 20) + 20) <= chart1.Series[0].Points.Count)
            {

                chartArea.AxisX.ScaleView.Zoom(val, val + 20);
            }
            else
            {
                int rem = ((hscroll_chart.Value * 20) + 20) - chart1.Series[0].Points.Count;
                chartArea.AxisX.ScaleView.Zoom(val, val + rem);
            }
        }


Now run the application, when the DataPoints are more than 20 you can use scroll bar control. You can also change the DataPoints limit.