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

How to get arrow heads on x and y axis?

3 Answers 99 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
rudi
Top achievements
Rank 1
rudi asked on 31 Jan 2019, 09:05 AM
Is it possible to style a LinearAxis in a RadChart with ScatterLineSeries to have arrow heads in positive directions, as indicated in red on attached picture.

3 Answers, 1 is accepted

Sort by
0
rudi
Top achievements
Rank 1
answered on 04 Feb 2019, 08:56 AM

HeloooOOOooOOOooooo-o-o-o-o-o......

 

Anybody in here with a hint, or that can say "no", can't be done?

0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 04 Feb 2019, 02:15 PM
Hello, Rudi,        

By default, the axis in RadChartView doesn't show arrows. However, you can create a custom CartesianRenderer and add your custom drawing for the axis in the CartesianAxisDrawPart. You can find below a sample code snippet. Note that this is just a sample approach and it may not cover all possible cases. Feel free to modify it in a way which suits your requirement best: 



public RadForm1()
{
    InitializeComponent();
 
    this.radChartView1.CreateRenderer += new ChartViewCreateRendererEventHandler(radChartView1_CreateRenderer);
 
    LineSeries lineSeries = new LineSeries();
    lineSeries.DataPoints.Add(new CategoricalDataPoint(20, "Jan"));
    lineSeries.DataPoints.Add(new CategoricalDataPoint(22, "Apr"));
    lineSeries.DataPoints.Add(new CategoricalDataPoint(12, "Jul"));
    lineSeries.DataPoints.Add(new CategoricalDataPoint(19, "Oct"));
    this.radChartView1.Series.Add(lineSeries);
    LineSeries lineSeries2 = new LineSeries();
    lineSeries2.DataPoints.Add(new CategoricalDataPoint(18, "Jan"));
    lineSeries2.DataPoints.Add(new CategoricalDataPoint(15, "Apr"));
    lineSeries2.DataPoints.Add(new CategoricalDataPoint(17, "Jul"));
    lineSeries2.DataPoints.Add(new CategoricalDataPoint(22, "Oct"));
    this.radChartView1.Series.Add(lineSeries2);
}
 
private void radChartView1_CreateRenderer(object sender, ChartViewCreateRendererEventArgs e)
{
    e.Renderer = new CustomCartesianRenderer(e.Area as CartesianArea);
}
 
public class CustomCartesianAxisDrawPart : CartesianAxisDrawPart
{
    public CustomCartesianAxisDrawPart(CartesianAxis axis, IChartRenderer renderer) : base(axis, renderer)
    {
    }
 
    int arrowOffset = 50;
 
    protected override RectangleF GetClipRect()
    {
        RectangleF rect = base.GetClipRect();
        if (rect.Height < rect.Y)
        {
            return new RectangleF(rect.X, rect.Y - arrowOffset, rect.Width, rect.Height * 4);
        }
        return rect;
    }
 
    protected override void DrawAxis()
    {
        AxisModel model = this.Element.Model;
        RadRect slot = model.LayoutSlot;
        float x1, x2, y1, y2;
 
        // update line points
        if (model.Type == AxisType.First)
        {
            x1 = this.ViewportOffsetX + (float)slot.X;
            x2 = this.ViewportOffsetX + (float)slot.Right;
 
            if (model.VerticalLocation == AxisVerticalLocation.Bottom)
            {
                y1 = this.ViewportOffsetY + (float)slot.Y;
                y2 = this.ViewportOffsetY + (float)slot.Y;
            }
            else
            {
                y1 = this.ViewportOffsetY + (float)slot.Bottom;
                y2 = this.ViewportOffsetY + (float)slot.Bottom;
            }
        }
        else
        {
            y1 = this.ViewportOffsetY + (float)slot.Y;
            y2 = this.ViewportOffsetY + (float)slot.Bottom;
            if (model.HorizontalLocation == AxisHorizontalLocation.Left)
            {
                x1 = this.ViewportOffsetX + (float)slot.Right;
                x2 = this.ViewportOffsetX + (float)slot.Right;
            }
            else
            {
                x1 = this.ViewportOffsetX + (float)slot.X;
                x2 = this.ViewportOffsetX + (float)slot.X;
            }
        }
 
        CartesianRenderer renderer = (CartesianRenderer)this.Renderer;
        RadGdiGraphics radGraphics = new RadGdiGraphics(renderer.Graphics);
        RectangleF rect = ChartRenderer.ToRectangleF(model.LayoutSlot);
 
        SizeF offset = ((CartesianRenderer)this.Renderer).GetAxisOffset((CartesianAxis)this.Element);
 
        GraphicsPath borderPath = new GraphicsPath();
        borderPath.AddLine(x1 + offset.Width, y1 + offset.Height, x2 + offset.Width, y2 + offset.Height);
 
        if (y1 == y2)//the horizontal axis
        {
            int arrowOffset = 50;
 
            radGraphics.DrawLine(Color.Black, x2 + offset.Width - arrowOffset / 2, y2 + offset.Height + arrowOffset / 4, x2 + offset.Width, y1 + offset.Height);
            radGraphics.DrawLine(Color.Black, x2, y1, x2 - arrowOffset / 2, y2 - arrowOffset / 4);
        }
 
        BorderPrimitiveImpl border = new BorderPrimitiveImpl(this.Element, null);
        border.PaintBorder(radGraphics, null, borderPath, rect);
    }
}
 
public class CustomCartesianRenderer : CartesianRenderer
{
    public CustomCartesianRenderer(CartesianArea area) : base(area)
    {
    }
 
    protected override void InitializeAxes()
    {
        // base.InitializeAxes();
        IEnumerator<Axis> axisEnumerator = this.Area.Axes.GetRenderEnumerator();
        while (axisEnumerator.MoveNext())
        {
            this.DrawParts.Add(new CustomCartesianAxisDrawPart((CartesianAxis)axisEnumerator.Current, this));
            this.DrawParts.Add(new AxisLabelDrawPart(axisEnumerator.Current, this));
            this.DrawParts.Add(new AxisTitleDrawPart(axisEnumerator.Current, this));
        }
    }
}

Off topic, note that most of the forum threads are reviewed by Telerik representatives and sometimes we address the questions asked by our customers in the forums as well. However, a post in the forum doesn't guarantee you a response from the Telerik support team. Moreover, threads are handled according to license and time of posting, so if it is an urgent problem, we suggest you use a support ticket, which would be handled before a forum thread

I hope this information helps. If you need any further assistance please don't hesitate to contact me. 

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
rudi
Top achievements
Rank 1
answered on 05 Feb 2019, 06:21 AM

Thanks a lot for your detailed answer Dess.

And Yes, I understand that this is not a 24x7 instant support forum. But I had hoped for another Telerik user to just point me in the right direction.

Having the comprehensive detailed example above from you is excellent service, thanks a lot!!!

Tags
ChartView
Asked by
rudi
Top achievements
Rank 1
Answers by
rudi
Top achievements
Rank 1
Dess | Tech Support Engineer, Principal
Telerik team
Share this question
or