chart ui categoryAxis custom labels

[Arsen]

Hi, could you please explain me how can i implement something like in attached image.
So, I need to make line chart with custom labels. I need to have two kind of labels: with different size of majorTicks and font-size,  like shows in attached file.

Thanks in advance.

[Victor]

Hi Arsen,

Thanks for writing.
Currently we do not have support for minor ticks and labels, all ticks/labels are the same. However, you can take full control over the label rendering by providing a custom label renderer. Each axis has a setLabelRenderer() method that you can use to insert your implementation. You can use this, to at least make your major labels larger.

Please write again if you have more questions.

Regards,
Victor
Telerik

 

 

[Arsen]

Victor, thank you for the quick answer.

Could you provide small example ?
I did not understand how to make custom label renderer and realise two kind of ticks/labels together.

Thanks 

[Victor]

Hello Arsen,

As a simple example, consider this code snippet:

public class CustomLabelsAxis extends CategoricalAxis {
    @Override
    protected void renderLabelNoFitMode(Canvas canvas, RadRect layoutSlot, String labelContent, AxisLabelModel labelModel) {
        TextPaint customLabelPaint = new TextPaint();
        customLabelPaint.setColor(Color.MAGENTA);
        // Set this size based on your label model index.
        // For example to render every second label use (labelModel.index() % 2) == 0 as a condition
        // and then call customLabelPaint.setTextSize(50); to render a label with a size of 50 pixels.
        StaticLayout textInfo = labelModel.getLabelSizeInfo().textLayout;
        float x = (float) layoutSlot.x;
        float y = (float) layoutSlot.y + textInfo.getLineBaseline(0);
        canvas.drawText(labelContent, x, y, customLabelPaint);
    }
}

Since the Axis class implements the AxisLabelRenderer interface you can inherit from it and override some of the axis specific label rendering methods. 

However, I must inform you, that this code will work only with the latest chart version which will be officially released in two weeks.

There is no easy way to do this with the current release.

Regards,
Victor
Telerik

 

 

[Arsen]

Victor, Thanks a lot

I have one more urgent question, if it's possible answer this one too: http://www.telerik.com/forums/chart-ui-categoryaxis-label's-template-issue

Thanks again

[Victor]

Hi Arsen,

I have move the thread you referred to to its appropriate forum, the team that works on the kendo charts will be able to assist you more efficiently.

Regards,
Victor
Telerik

 

 

[Arsen]

Thanks, that's right.