Overriding RadChartView rendering

1 Answer 87 Views
ChartView
Neil Mercer
Top achievements
Rank 1
Neil Mercer asked on 03 Apr 2023, 06:37 AM

Hi,

I'm trying to create a specific chart in RadChartView, where I need to have some annotations which are outside the grid area.  I thought I could extend the axis beyond what is needed and then add the annotations in the space created.   The chart will always have a minimum value of 0, so I extended the axis to -20, which works well to create the space.

However, to make it look correct I need to be able to override the rendering of the axis line, label and grid lines in order to remove the labels for negative values on the axis, and remove the grid and axis lines so the negative space doesn't appear to be part of the chart.  I've managed to do this for the labels, but cannot find an example of overriding the generation of the grid lines or axis line.

Attached is an image of where I am currently at - what I need is to remove all lines on the grid below 0 on the vertical axis.

Has anyone got an example of doing this, or something similar?

Thanks,
Neil.

1 Answer, 1 is accepted

Sort by
0
Dinko | Tech Support Engineer
Telerik team
answered on 05 Apr 2023, 10:30 AM

Hello Neil,

Thank you for your interest in our RadChartView for WinForms.

The control provides a way to create a custom renderer to customize its elements as demonstrated in this Custom Rendering help article. The grid lines are represented by the CartesianGridDrawPart. You could override the InitializeGrid() method and add your own implementation of CartesianGridDrawPart. The magic happens in the Draw() method.

private void radChartView1_CreateRenderer(object sender, ChartViewCreateRendererEventArgs e)
{
    e.Renderer = new CustomCartesianRenderer(e.Area as CartesianArea);
}

public class CustomCartesianRenderer : CartesianRenderer
    {
        public CustomCartesianRenderer(CartesianArea area)
        : base(area)
        { }
        protected override void InitializeGrid()
        {
            //base.InitializeGrid();
            if (this.Area.Grid is CartesianGrid)
            {
                this.DrawParts.Add(new CustomCartesianGridDrawPart((CartesianGrid)this.Area.Grid, this));
            }
        }        
    }
    public class CustomCartesianGridDrawPart : DrawPart<CartesianGrid>
    {
        public CustomCartesianGridDrawPart(CartesianGrid grid, IChartRenderer renderer)
            : base(grid, renderer)
        { }
        public override void Draw()
        {
           // custom logic
        }
    }

However, upon checking the source code to propose a suitable solution, the base logic of the Draw() method contains a lot of internal classes which makes it almost impossible to modify the source code. You will have to create the logic which draws the grid lines from scratch. What I can suggest instead is to place Marked Zone annotation and the area in which you want to hide the grid. The annotation will be placed on top of the grid. Here is what I have in mind. You can observe how the grid lines under 0 are not visible.

You can find the sample project which I created to test your scenario. I hope that this approach will work for you.

Regards,
Dinko | Tech Support Engineer
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
ChartView
Asked by
Neil Mercer
Top achievements
Rank 1
Answers by
Dinko | Tech Support Engineer
Telerik team
Share this question
or