This is a migrated thread and some comments may be shown as answers.

Show only one Major/Minor grid line in RadChart

1 Answer 194 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
Raj
Top achievements
Rank 1
Raj asked on 08 Feb 2015, 06:29 PM
I need to show a (only one) line across Bar chart to show current time. I am using RadChart first time and found Major/Minor Gridlines to show lines on graph, but either all grid lines will show or hide. I want only one grid line showing current time. Chart is simply showing stock name/number one X axis and price on Y axis. I am not using second Y axis. Any other option than gridline if can't achieve using gridline. Please help as earliest possible. Thanks

1 Answer, 1 is accepted

Sort by
0
Hristo
Telerik team
answered on 11 Feb 2015, 04:46 PM
Hello Raj,

Thank you for writing.

You could reach this type of functionality by attaching a custom controller which will draw a vertical today indicator. In order to position the indicator correctly we would need to calculate its coordinates compared to the axis start and end. Please see my code snippet below:
public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
 
        BarSeries barSeries = new BarSeries();
        barSeries.DataPoints.Add(new CategoricalDataPoint(118, DateTime.Now.Date.AddHours(0)));
        barSeries.DataPoints.Add(new CategoricalDataPoint(177, DateTime.Now.Date.AddHours(4)));
        barSeries.DataPoints.Add(new CategoricalDataPoint(128, DateTime.Now.Date.AddHours(8)));
        barSeries.DataPoints.Add(new CategoricalDataPoint(111, DateTime.Now.Date.AddHours(12)));
        barSeries.DataPoints.Add(new CategoricalDataPoint(118, DateTime.Now.Date.AddHours(16)));
        barSeries.DataPoints.Add(new CategoricalDataPoint(118, DateTime.Now.Date.AddHours(20)));
        barSeries.DataPoints.Add(new CategoricalDataPoint(118, DateTime.Now.Date.AddHours(24)));
 
        DateTimeContinuousAxis continuousAxis = new DateTimeContinuousAxis();
        continuousAxis.LabelFormat = "{0:d}";
        continuousAxis.LabelFitMode = AxisLabelFitMode.MultiLine;
        barSeries.HorizontalAxis = continuousAxis;
        radChartView1.Series.Add(barSeries);
 
        this.radChartView1.Controllers.Add(new TodayIndicatorController());
    }
}
 
public class TodayIndicatorController : ChartViewController
{
    protected ViewResult result;
 
    public TodayIndicatorController()
    {
        this.result = new ViewResult(new TodayIndicatorView(this));
    }
 
    protected override ActionResult OnDraw(EventArgs e)
    {
        return this.result;
    }
 
    private class TodayIndicatorView : IView
    {
        private TodayIndicatorController owner;
 
        public TodayIndicatorView(TodayIndicatorController owner)
        {
            this.owner = owner;
        }
 
        public void Render(object context)
        {
            Graphics graphics = context as Graphics;
 
            if (!(this.owner.Area is CartesianArea))
            {
                return;
            }
 
            using (Pen pen = new Pen(Color.LightBlue, 3))
            {
                CartesianArea area = this.owner.Area as CartesianArea;
                MethodInfo mi = area.GetType().GetMethod("GetCartesianClipRect", BindingFlags.NonPublic | BindingFlags.Instance);
                RectangleF clipRect = (RectangleF)mi.Invoke(area, null);
 
                IChartView chartView = area.View;
                float panX = (float)chartView.PlotOriginX;
                float panY = (float)chartView.PlotOriginY;
 
                float x = (float)this.GetLocationOfValue(DateTime.Now);
 
                PointF lineStart = new PointF(x, clipRect.Y);
                PointF lineEnd = new PointF(x, clipRect.Bottom);
 
                graphics.DrawLine(pen, lineStart, lineEnd);
            }
        }
 
        private double GetLocationOfValue(DateTime value)
        {
            DateTimeContinuousAxis axis = this.owner.Area.Axes[0] as DateTimeContinuousAxis;
            PropertyInfo modelProperty = axis.GetType().GetProperty("Model", System.Reflection.BindingFlags.Instance | System.Reflection.BindingFlags.NonPublic);
            object model = modelProperty.GetValue(axis);
 
            PropertyInfo plotInfoProperty = model.GetType().GetProperty("PlotInformation", BindingFlags.NonPublic | BindingFlags.Instance);
            object plotInfo = plotInfoProperty.GetValue(model);
 
            FieldInfo minField = plotInfo.GetType().GetField("Min", BindingFlags.Instance | BindingFlags.Public);
            decimal min = (decimal)minField.GetValue(plotInfo);
            FieldInfo maxField = plotInfo.GetType().GetField("Max", BindingFlags.Instance | BindingFlags.Public);
            decimal max = (decimal)maxField.GetValue(plotInfo);
            FieldInfo extendField = plotInfo.GetType().GetField("Extend", BindingFlags.Instance | BindingFlags.Public);
            decimal ext = (decimal)extendField.GetValue(plotInfo);
 
            decimal delta = max - min;
            decimal extend = ext / 2;
            decimal pointTicks = value.Ticks;
            decimal pointPosition = (pointTicks - min + extend) / delta;
            double position = (double)(pointPosition);
 
            ChartNode node = model as ChartNode;
            IChartView view = (IChartView)this.owner.Area.View;
            CartesianArea area = this.owner.Area.View.GetArea<CartesianArea>();
 
            double result;
 
            if (area != null &&
                ((area.Orientation == Orientation.Vertical && axis.AxisType == AxisType.First) ||
                (area.Orientation == Orientation.Horizontal && axis.AxisType == AxisType.Second)))
            {
                result = view.PlotOriginX + node.LayoutSlot.X + position * node.LayoutSlot.Width;
            }
            else
            {
                result = view.PlotOriginY + node.LayoutSlot.Y + (1.0d - position) * node.LayoutSlot.Height;
            }
 
            return result;
        }
    }
 
}

I am also sending you screenshot showing the result on my end.

Regards,
Hristo Merdjanov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
ChartView
Asked by
Raj
Top achievements
Rank 1
Answers by
Hristo
Telerik team
Share this question
or