Hello
I'd like to get a chart like on the attached picture. The problem is I don't understand how to implement the labels below the chart. These labels are not for the points, but for the intervals. For example, assume we have the following array of points {{20, 30}, {40, 15}, {60, 70}} (so 3 points, the first value means X coordinate, the second means Y). In this case I should get 2 labels under the chart. The first one between 20 and 40 value, and the second between 40 and 60.
I tried to use CategoricalAxis, but as I see it doesn't fit exactly what I need. I tried to use annotations, but I didn't manage to locate them under the chart.
Could you please help me and advise how to implement that?
I'd like to get a chart like on the attached picture. The problem is I don't understand how to implement the labels below the chart. These labels are not for the points, but for the intervals. For example, assume we have the following array of points {{20, 30}, {40, 15}, {60, 70}} (so 3 points, the first value means X coordinate, the second means Y). In this case I should get 2 labels under the chart. The first one between 20 and 40 value, and the second between 40 and 60.
I tried to use CategoricalAxis, but as I see it doesn't fit exactly what I need. I tried to use annotations, but I didn't manage to locate them under the chart.
Could you please help me and advise how to implement that?
1 Answer, 1 is accepted
0
Hi George,
Let me try to explain you how the ticks of the axes are created. First of all you can keep in mind that the RadCartesianChart has two general types of axes - numerical and categorical. When you have categorical data and use CategoricalAxis the chart will create e slot on the axis for each category. Then each data point will be place its category slot (the length between two adjacent ticks), which means that the points will be between the labels.
For example if you have the points {{20, 30}, {{20, 55}, {40, 15}, {60, 70}} where the first value is X coordinate on a CategoricalAxis, the axis will have 3 categories (20, 40, 60) and 3 labels (one for each category). Each data point will be placed in its corresponding category slot.
On the other hand the ticks on a numeric axis (for example LinearAxis) will be created based on the axis range and its major step, which on their turn are calculated based on the smallest and the biggest value plotted on the axis.
The series demonstrated on the attached picture looks like a ScatterLineSeries, but the horizontal axis looks like a Categorical. The ScatterSeries are designed to work with both numeric axes and this is why you won't be able to use a categorical one. However, as you mentioned you should be able to use annotations for the labels. Note that you will need to set the ClipToPlotArea property of the annotations, otherwise they will be clipped when you place them under the axis. To hide the original ticks on the axis you can set its ElementBrush and LineStroke properties.
I prepared a sample project that demonstrates this approach. Please take a look at it and let me know if I am missing something.
Regards,
Martin
Telerik
Let me try to explain you how the ticks of the axes are created. First of all you can keep in mind that the RadCartesianChart has two general types of axes - numerical and categorical. When you have categorical data and use CategoricalAxis the chart will create e slot on the axis for each category. Then each data point will be place its category slot (the length between two adjacent ticks), which means that the points will be between the labels.
For example if you have the points {{20, 30}, {{20, 55}, {40, 15}, {60, 70}} where the first value is X coordinate on a CategoricalAxis, the axis will have 3 categories (20, 40, 60) and 3 labels (one for each category). Each data point will be placed in its corresponding category slot.
On the other hand the ticks on a numeric axis (for example LinearAxis) will be created based on the axis range and its major step, which on their turn are calculated based on the smallest and the biggest value plotted on the axis.
The series demonstrated on the attached picture looks like a ScatterLineSeries, but the horizontal axis looks like a Categorical. The ScatterSeries are designed to work with both numeric axes and this is why you won't be able to use a categorical one. However, as you mentioned you should be able to use annotations for the labels. Note that you will need to set the ClipToPlotArea property of the annotations, otherwise they will be clipped when you place them under the axis. To hide the original ticks on the axis you can set its ElementBrush and LineStroke properties.
I prepared a sample project that demonstrates this approach. Please take a look at it and let me know if I am missing something.
Regards,
Martin
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.